0

我有一个关于我想写的指令的问题。这是jsfiddle 这是 HTML

<div ng-controller="TestCtrl">
    <mydir base="{{absolute}}">
        <div>{{path1}}</div>
        <div>{{path2}}</div>
    </mydir>
</div>

该指令称为“mydir”，将需要基本属性的值和所有路径值（可以定义任意数量的路径）。我不想将控制器中的值直接注入指令范围（它们需要是独立的）。我对此有 3 个问题（也请查看 jsfiddle！）

1) 虽然代码按现在的样子运行，但有一个错误：“TypeError: Object # has no method 'setAttribute'”。有什么建议有什么问题吗？

2) 在指令 scope.base 中是“未定义”而不是“/base/”。这个可以修吗。

3) 如何列出指令中的所有路径值？

4

3 回答 3

2

您需要设置一个隔离范围来声明此指令的基本属性：

scope: {
    base: "@"
}

这解决了（2）。

问题（1）是replace: true与上面的配合造成的scope，因为它创建了一个评论节点来包含重复<div>的s。

对于 (3)，添加paths: "="到范围，并且通常将它们作为数组从父控制器传递。

见分叉小提琴：http: //jsfiddle.net/swYAZ/1/

于 2013-09-17T12:48:22.250 回答
1

如果您想制作一个健壮的指令以能够将数据替换为其内容 (3) 您可以将引用作为属性传递并相应地显示数据。

看到这篇文章，寻找包装小部件。

于 2013-09-17T13:37:41.190 回答
1

您正在通过设置scope: true您想要做的事情在指令中创建一个新范围：

app.directive('mydir', function ($compile, $rootScope) {
    return {
        replace: true,
        restrict: 'E',
        template: '<div ng-repeat="p in paths"> {{base}}{{p}}/{{$index}}</div>',
        scope: {
            base : '='
        },

        link: function (scope, iElement, iAttrs) {
            scope.paths = ['p1', 'p2'] ;
        }
    }
});

这将在指令的本地范围和父范围之间建立双向绑定。如果父控制器中的值发生变化，指令中的值也会发生变化。

http://jsfiddle.net/4LAjf/8/

于 2013-09-17T12:50:02.423 回答