Reputation: 6021
I have an ng-repeat working fine. I applied an x-editable that works fine too. There are many pages, paging is applied. I am using ng-table. Yet when some records are updated using jquery x-editabe (via its ajax method) then angularjs, ng-repeat stop updating that particular . Why?
<td title="'Price'" data-type="number" my-x-editable data-sortable="'Price'" filter="
{'Price':'text'}">{{product.Price}}
</td>
<td title="'Vendor'" data-sortable="'Vendor'" filter="{'Price':'text'}">
<a href="#" id="VendorID" class ="xEditable" data-type="select" data-pk="{{product.ID}}" data-source='@Url.Action("ProductVendors")' data-value="{{product.Vendor.ID}}" data-url ="@Url.Action("UpdateAttributes")" title ="@Resources.OA_Attribute_Vendor">{{product.Vendor.Name}}</a>
</td>
If I dont update using x-editable, everything keeps working fine. When I use x-editable that particular column do not get updated with ng-repeat when I go to next page.
Upvotes: 1
Views: 780
Reputation: 66
For any changes done outside AngularJS(like DOM manipulations etc.) one needs to call $apply so that AngularJS can pick and reflect those changes on the view.
here is a useful link : http://jimhoskins.com/2012/12/17/angularjs-and-apply.html
Upvotes: 4
Reputation: 1336
You need to call $scope.$apply for Angular to know about changes made outside Angular's own context.
Upvotes: 2