Epaga Epaga - 2 months ago 11
AngularJS Question

How to submit new entity as well as clear $anchor.task?

Using the Angular framework, how do I have the "Submit" button both update the current entity as well as clear the anchor ID - I basically want to rapid-fire add entries, but it always turns my add form into an edit form.

Here's my current div which isn't working, it's like it's ignoring the

$anchor.task=null
...

Note that the "Add New" button works fine!

<div>
Description: <input name="task.desc" ng-required><br>
<a href="#" ng-action="task.$save(); $anchor.task=null">Save</a>
<input type="button" value="Add New" ng-action="$anchor.task=null">
</div>

Answer

If you want to have fast adds here is what you need to change

I assume you have: ng-entity="task=Task" in your code. You need to change that to ng-entity="Task" this changes the declaration so that it is not associated with the anchor. See http://docs.getangular.com/Ng-entity for more details. This also means that you have to manually instantiate the task instance in ng-init.

Then in the Save anchor you need to instantiate Task document with the defaults of the task object: Task(task)

Than you need to save it: Task(task).$save()

Finally you want to clear the form so you need to reset the task object to blank. This can only be done after the object saves so you need to include a callback to the $save() method: Task(task).$save( {: $root.task={}; } )

$root refers to root scope as the scope inside the callback is not the same as the scope where task is declared.

<div ng-entity="Task" ng-init="task={}">
        Description: <input name="task.desc" ng-required><br>
        <a href="#" ng-action="Task(task).$save({: $root.task={} })">Save</a>
</div>