Question

我试图找出何时以及如何在角度指令中使用link函数。

说我有以下指令：

    app.directive("lbArticle", function() {
    return {
        restrict : "E",
        templateUrl: 'tpl/directives/information/article.html',
        scope: {
            article: '='
        },
        link: function(scope,element, attr){
            scope.info = attr.article;
        }
    };
});

现在将对象传递给HTML的article附件

<lb-article article='{{myObject}}'> </lb-article>

当发生这种情况并且指令被渲染时，它应该设置一个名为info的变量等于myObject

所以如果myObject看起来像这样：

myObject{name: 'Hello', created: '2015-04-04'; }

然后以下内容应显示以下变量：

我的指令html

   <span class="block text-ellipsis">{{info.name}}</span>
    <small class="text-muted">{{info.created | fromNow}}</small>

然而这不起作用？

据我所知，文档中link function应该用于DOM操作，还可以用于设置可能在实际指令之前呈现的变量？

Answer 1

此行scope.info = attr.article;是多余的，因为您可以通过双向绑定article访问=article。因此，您可以在模板中用info替换所有出现的article，因为这在范围内可用。您还需要从<lb-article article='{{myObject}}'> </lb-article>中删除大括号以使双向绑定起作用，因为您需要对该对象的引用。

有一个很好的，易于遵循的article指令，涵盖了大多数这些概念（链接/压缩函数，双向/单向绑定，范围等）。

角度理解链接功能

1 个答案: