javascript - using ng-repeat with directives causes child directives not to update -


so if found interesting bug in angular.js. if have custom directive inside ng-repeat actively changing variables in directive don't update. meaning if have 3 elements in array ng-repeat initializes fine if delete element 1 array variables element 1 had passed child directive somehow end in element 2's child directive here example code.

<div ng-app='testing'>     <div ng-controller='testing test'>         <div ng-repeat='item in test.example track $index'>             {{item.title}}             <child scope='item.data'></child>             <button ng-click="test.delete($index)">                delete             </button>         </div>     </div> </div> 

then in js file

console.log('hello world'); var app=angular.module('testing',['testingchild']); app.controller('testing',[function(){     this.example=[{         title:"this first title",         data:"this first index"     },{         title:"this second title",         data:"this second index"     },{         title:"this third title",         data:"this third index"     }];     this.delete=function(index){         this.example.splice(index,1);     }; }]); var child=angular.module('testingchild',[]); child.directive('child',[function(){     return{         restrict:"e",         scope:{             parent:"=scope"         },         template:"<div>{{child.parent}}</div>",         controller:['$scope',function($scope){             this.parent=$scope.parent;         }],         controlleras:"child"     }; }]); 

and have functioning jsfiddle here. have see work delete 1 of first elements. know causes , how fix it?

side note:

i thought might useful mention when using in slighty different situation editable elements in child (like text box) data binding worked child parent. assigning variable attached controller scoped variable parent worked in direction. seems situation have come across parent child , not working.

change:

template:"<div>{{child.parent}}</div>", controller:['$scope',function($scope){ this.parent=$scope.parent; }] 

to:

template:"<div>{{parent}}</div>" controller:function(){ } 

since using controlleras syntax, dont need $scope injection. binding work expected, dont use child.parent, parent (or whatever inject in context on controller


Comments

Popular posts from this blog

ruby - Trying to change last to "x"s to 23 -

jquery - Clone last and append item to closest class -

c - Unrecognised emulation mode: elf_i386 on MinGW32 -