Replace input field with read only text in AngularJS

Question

I have some jQuery currently set up to remove the input field from view and write the value of the input field as plain text inside a span, however I'm wondering how AngularJS would handle this. The event happens upon submitting a form, that part is already done through ajax as well. It's not just one input, it's all of them on the form so you can see the results of what you just submitted.

Answer 1

Use ng-show and/or ng-hide on each input field and its associated text equivalent.

When you submit the form, toggle some $scope property:

<input type="text" ... ng-model='text1' ng-show="editMode">
<span ng-hide="editMode">{{text1}}</span>

In your controller, initialize editMode to true. In your submit function, set it to false.