问题描述
在指令中使用ng-repeat循环显示出商品列表
angular.module('goodsInsert',[]) .directive('myDirective',function(){return{ restrict:’EA’, template:’<p ng-repeat='item in data' ng-click='toPage({{item.id}})'>’ +’<p class='goods_left'><img src='https://www.6hehe.com/wenda/{{item.images}}' alt='' /></p>’ +’<p class='goods_right'>’ +’<p class='goods_describe'>{{item.name}}</p>’ +’<p class='goods_info'><p>{{item.price | currency:'￥'}}</p><p>已售{{item.saleCount}}件</p></p>’ +’<p class='user_wrap'><img src='https://www.6hehe.com/wenda/{{item.producer.header}}' alt='' /><p class='grey'>{{item.producer.lastname}}</p></p>’ +’</p>’ +’</p>’}; });
在controller中定义跳转传参，main为产品列表展示页，design为选中跳转的商品详情页
myApp.controller('mainCtrl', function($scope,$http,goodsService,$state) { var data=goodsService.getNewGoods(); data.then(function(data){$scope.data=data.results; },function(data){$scope.error=data; }); $scope.toPage=function(id){if ($scope.$root.$$phase != ’$apply’ && $scope.$root.$$phase != ’$digest’) { $scope.$apply();}alert(111);$state.go(’index.detail’,{ID:$scope.data[0].id}); }});myApp.controller(’designCtrl’,function($scope,$state,$stateParams){var receivedId = $stateParams.ID; alert(receivedId);})
此时并不跳转，也不能触发点击事件，将在ng-repeat中添加的ng-click改为toPage（id）可以跳转，但此时传递的参数依然是controller中写死的$scope.data[0].id，不是点击对应的商品请问各位大神有什么解决办法嘛？
问题解答
回答1：找到答案啦！！ng-click=toPage(item.id)去掉参数中的{{}}，其他都不用动，就可以解决哦
回答2：angular.module('goodsInsert',[]) .directive('myDirective',function(){return{ restrict:’EA’, template:’<p ng-repeat='(item,key) in data' ng-click='toPage(key)'>’ +’<p class='goods_left'><img src='https://www.6hehe.com/wenda/{{item.images}}' alt='' /></p>’ +’<p class='goods_right'>’ +’<p class='goods_describe'>{{item.name}}</p>’ +’<p class='goods_info'><p>{{item.price | currency:'￥'}}</p><p>已售{{item.saleCount}}件</p></p>’ +’<p class='user_wrap'><img src='https://www.6hehe.com/wenda/{{item.producer.header}}' alt='' /><p class='grey'>{{item.producer.lastname}}</p></p>’ +’</p>’ +’</p>’}; });
$scope.toPage=function(key){if ($scope.$root.$$phase != ’$apply’ && $scope.$root.$$phase != ’$digest’) { $scope.$apply();}alert(111);$state.go(’index.detail’,{ID:$scope.data[key].id}); }回答3：
额。ng-click中的方法传参，不需要{{}}
