如何訪問指令範圍中的ng-repeat項目？

你怎麼這樣的事情設定的範圍值：如何訪問指令範圍中的ng-repeat項目？

<div ng-controller="MyCtrl"> 
     <my-element ng-repeat="p in people" person='p'></my-element> 
</div>

var myApp = angular.module('myApp',[]); 

myApp.directive('myElement', function(){ 
    return { 
     restrict: 'E', 
     template: '<div>{{ name }}</div> <div>{{ age }}</div>' 
    } 
}); 

function MyCtrl($scope) { 
    $scope.people = [{ name: 'Mike', age: 20 },{name: 'Peter', age: 22 }]; 
}

來源

2013-02-02 Agzam

如果「所設定的範圍值，」你的意思是有模板的工作，那麼

template: '<div>{{ p.name }}</div> <div>{{ p.age }}</div>'

由於每個迭代ng-repeat創建一個新的子範圍，在該範圍上定義p。因爲你的指令，也沒有創造一個隔離範圍，你不需要屬性person，所以此工程在與上述：

<my-element ng-repeat="p in people"></my-element>

如果你想要一個分離範圍，使用

<my-element ng-repeat="p in people" person='p'></my-element>

和

return { 
    restrict: 'E', 
    scope: { 
     person: '=' 
    }, 
    template: '<div>{{ person.name }}</div> <div>{{ person.age }}</div>' 
}

來源

2013-02-02 01:50:23

是這種形式'ng-repeat =「p在人」人='p''仍然有效。我沒有看到它在文檔中提到，並給我錯誤。謝謝 – bsr

@bsr，它應該是有效的：[工作小提琴]（http://jsfiddle.net/mrajcok/xgxQJ/） –

感謝馬克爲小提琴 – bsr

我喜歡在定義指令範圍時使用'@'。這使隔離範圍訪問P，例如在鏈接的指令：

return { 
    scope: '@', 
    link: function(scope) { 
     console.log(scope.p); //It can now be accessed because of '@' 
    } 
}

來源

2013-10-10 10:08:54

它也可以不用'@'來訪問 – asologor

你不需要創建的指令一個孤立的範圍。 ng重複將自動爲您執行此操作。所以才刪除：

在指令

：

scope: { 
    person: '=' 
},

，並在NG重複HTML標記：

person='p'

在你的指令

，你將能夠訪問像

$scope.p.personAttribute

像這裏的解釋中提到的那樣： angularjs-pass-instance-of-each-ng-repeat-in-html-to-directive

來源

2014-07-23 10:07:05 Guntram

如何訪問指令範圍中的ng-repeat項目？

回答

相關問題