How to change button label in angularjs according to requirement?

Question

I want to change the label of same button in angularjs according to requirement, same button can be for update and submit.

See the following demo,

Above demo is

Answer 1

Change your markup for button to show some scope property:

<a class="btn btn-success" ng-click="updateOrder($index)">{{btnText}}</a> 

And add some logic to your controller, that will specify text for button:

if (newItem){
  $scope.btnText = 'Submit';
}else{
  $scope.btnText = 'Update';
}

Answer 2

I understand that while while adding data you wanted to show Submit button label & show Update button label while updating record.

So as normal practice you are getting this value from the DB, so I'd suggest you to add id column in this object which will be there with fields. Now object will look like {id: 1, field1: '1', field2: 2} so if the element has id that means it has persisted in the database. And obviously if you don't have id in fields record means it has been added from UI.

So the whole logic will look at the id property of your object, if you have id in the record then it will show Update as button label otherwise it would be Submit

<div class="col-md-3">
   <a class="btn btn-success" ng-click="updateOrder(field)" 
      ng-bind="field.id? 'Update': 'Submit'">
      Submit
   </a>   
</div>      

So for make your logic working good, you need to get the list again from the database to make your UI consistent.

Working Plunkr