I have textboxes within an ng-repeat block. To detect changes from the original content, I store the original data in a variable.
<tr data-ng-repeat="p in products">
<td>
<textarea data-elastic data-ng-model="p.comment" data-ng-change="hasChanged=checkChange(original, rnd.comment);" data-ng-init="original=rnd.comment; hasChanged=false"></textarea>
</td>
<td class="save" ng-show="hasChanged" ng-click="save(p, original)">Save</td>
A save button is displayed only when there are changes in the content. After a successful save, the original value should be updated to the new value.
To achieve this, I use a function in the controller:
$scope.save = function (p, original) {
//...successful save
this.original = p.comment; //this method works
original = p.comment; //this method does not work
}
Relying on 'this' for implicit scope doesn't seem like the best approach.
Why doesn't updating the variable (original = ...) work? Is there a better way to handle this?
After considering comments, I made the following updates:
ng-click="save(p, this)"
$scope.save = function (p, scope) {
//...successful save
scope.original = p.comment; //this method works
}
This approach seems more reasonable now. However, is passing scope around like this considered bad practice or acceptable?
The 'products' data is defined as follows:
productStatusApp.controller('productStatusCtrl', function ($scope, $http, cid) {
$http.get('api/company/products/' + cid).success(function (data) {
$scope.products = data.products;
});