我想编写一个简单的指令,显示来自父级的数据列表。
父控制器有类似的东西 $ scope.datas = [1,2,3,4]
我应该如何编写指令?
使用隔离范围并使用范围:{display:'='}
使用子范围并直接引用$ scope.datas ??我发现那很难看。我想重用指令,所以我想传递一个属性来指示应该使用哪个父字段。换句话说,我想对指令说我的数据在$ scope.datas或$ scope.dumpthat。
谢谢!
答案 0 :(得分:1)
我会使用isolated scope
。您可以在子项中使用父作用域属性,但由于Angular使用原型继承,因此您必须注意如何访问(以及您将要访问的内容)。
这是一个简单的指令:
<强> HTML 强>
<display-directive display="datas">Datas are:</display-directive>
<强>指令强>
app.directive("displayDirective", function(...) {
return {
restrict: "E",
scope: {
display: "=",
},
// Transclude will take the inner html of your directive and add it to
// any div which contains the ng-transclude directive
transclude: true,
// replace will swap out the inner html of the directive scope with
// the template you assign
replace: true,
template: [
"<div class='data-class'>",
" <div class='data-prefix' ng-transclude></div>",
" {{ display }}",
"</div>",
].join("\n"),
link: function(scope, element, attributes) {
// Initialize your directive here!
}),
};
});