angularjs - How to pass a object into a directive -
i have items array used ng-repeat render menu, , on click of add cart button additem() called.
currently pass name of selected item name attribute in item-container directive. how shall pass entire object through attribute directive
html snippet
<p ng-repeat = "item in items"> <item-container startcounter = 1 resetter = 'reset' item = 'item' name = {{item.name}} > {{item.name}} </item-container><br><br> </p> js snippet
.directive('itemcounter',function(){ return { controller: function() {return {}}, restrict:'e', scope:{ item:"=", resetter:"=" }, transclude:true, link:function(scope,elem,attr){ scope.qty = attr.startcounter scope.add = function(){ scope.qty++; } scope.remove = function(){ scope.qty--; } scope.additem = function(){ console.log(attr.item); scope.$parent.addmsg(scope.qty,attr.name) console.log("value when submitted:" + scope.qty + "name:"+ attr.name); scope.qty = attr.startcounter; scope.$parent.resettrigger(); } scope.$watch(function(attr){ return attr.resetter }, function(newvalue){ if(newvalue === true){ scope.qty = attr.startcounter; } }); }, template:"<button ng-click='additem();'>add cart</button>  "+ "<button ng-click='remove();' >-</button> "+ "{{qty}} " + "<button ng-click='add();'>+</button>  "+ "<a ng-transclude> </a>" }
currently aren't passing in name seems. passing in magic happens in part:
scope:{ resetter:"=" }, as can see, there no mention of name. need add field item , pass in:
scope:{ resetter:"=", item: "=" }, then can do
<p ng-repeat = "item in items"> <item-container startcounter = 1 resetter = 'reset' item = item > {{item.name}} </item-container><br><br> </p> also i'm sure dont want using transclude here. templateurl
Comments
Post a Comment