user2107843 user2107843 - 6 months ago 27
AngularJS Question

Angular this scope to be called outside

If look into this plunker Example

angular.module('testapp', [])
.controller('testcontroller',function ($scope) {
$scope.persons = [{ FirstName: 'John', LastName: 'Doe' }, { FirstName: 'Peter', LastName: 'mal' }];

$scope.onEdit = function ()
{
this.isInEditMode = true;
}

$scope.onCancel = function () {
this.isInEditMode = false;
}

$scope.addnew = function ()
{
this.isInEditMode = false;
}
})




<table>
<tr>
<th>Fname</th>
<th>Lname</th>
</tr>

<tr ng-repeat="person in persons">
<td><input type="text" ng-model="person.FirstName" ng-disabled="!isInEditMode" /></td>
<td><input type="text" ng-model="person.LastName" ng-disabled="!isInEditMode" /></td>
<td><input type="button" class="btn-primary" value="Edit" ng-click="onEdit()" /></td>
<td><input type="button" class="btn-primary" value="Cancel" ng-click="onCancel()" /></td>
</tr>

</table>
<input type="button" value="add" ng-click="addnew()"/>
</div>


I am handling

this.isInEditMode=true
in edit button click and false in cancel button click.I am trying to Make isInEditMode=false on click of addnew.I am not able to do that can some body help how to handle this.If i create $scope.isInEditMode it will enable/disable all rows which i don't want.

Answer

You can add isInEditMode property to each person and them simply set all of them to false.

$scope.onCancel = function () {
  $scope.persons.forEach(function (person) {
    person.isInEditMode = false;
  });
}

$scope.addnew = function () {
  this.isInEditMode = false;

  $scope.onCancel();
}

I forked your plunker with solution: https://plnkr.co/edit/pyBEuj79wIV2pcYRq2Lh?p=preview