ng-repeat模板中的角度指令

Question

我正在试验角度1.2指令。我有一个模板w/ng重复。在param中传递的变量似乎没有被指令看到。下面是代码：

小提琴：http://jsfiddle.net/supercobra/vmH3v/

控制器：

angular.module('myApp', []) 
.controller('Ctrl', ['$scope', function($scope) { 
    $scope.labels= 
     [{name:"abc", color:'blue'}, 
      {name:"xxx", color:'red'}];     
}]) 

.directive('prettyTag', function() { 
return { 
restrict: 'E', 
scope: {labelsArray: '@'}, 
    template: '<h2>Label list:{{labelsArray}}:</h2><div class="label label-warning" ng-repeat="label in labelsArray">{{label.name}}</div>', 

restrict: 'E', 
}; 

}); 

HTML：

<div ng-app="myApp" ng-controller="Ctrl"> 
    label Array: {{labels}} 
    <hr> 
    <pretty-tag labelsArray='{{labels}}'></pretty-tag> 
    <hr> 
</div> 

Answer 1

有一些需要改变的指令看到几件事情标签数组。

首先，漂亮的标记HTML改成这样：

<pretty-tag labels-array='labels'></pretty-tag> 

注意labelsArray改为标签阵列（指令&属性名称应遵循此虚线约定）和{{标签}}只是更改为标签（以便可以在阵列上建立双向绑定）。

接下来，你的指令里面，labelsArray范围应该是 '=' 使当地scope属性可以引用父作用域属性：

scope: {labelsArray: '='}, 

小提琴： http://jsfiddle.net/Hmcj8/