Question

我是AngularJS和指令的新手，我正在寻求对我实施的指令提出一些建议或指导。有问题的指令将用于向用户显示pdf。该指令公开了两个属性，即使用隔离范围定义的documentPath和documentType，如下所示：

    var directiveDefinition = {
        templateUrl: 'app/views/directives/document.html', 
        scope: {
            documentPath: '@documentPath', 
            documentType: '@documentType' 
        },
        restrict: 'E',                                  
        templateNamespace: 'html',
        link: linkFunc
    };

在使用该指令的视图中，我使用视图控制器的模型属性和字符串绑定属性。

<my-document document-path="{{ application.documentpath }}" document-type="Application"></my-document>

当我最初运行它时，我发现该指令有时会在模型返回数据之前运行。因此将显示一个空文档。其他时候，模型会在指令运行之前加载，因此当链接函数运行时文档路径会出现，允许显示文档。

我确定解决此问题的一种方法是在指令的documentPath属性上使用$ watch监听器。这似乎解决了这个问题。

成为AngularJS的新手，也是指令实现我的问题是......这是最好的解决方案吗？任何建议将不胜感激。谢谢！

Answer 1

$watch解决方案应该可以正常运行，但根据应用的复杂程度和总观察者数量，这可能会导致$digest周期缓慢。

另一种选择是使用＆＃34;发送参数作为参考。＆＃34; 点符号所以当数据从模型加载时（从大部分时间来自API，因为这是缓慢的部分）它将会更新，而不是发送字符串原语。

您的指令范围声明将变为：

scope: {
        documentPath: '=', 
        documentType: '=' 
    },

您将从父视图中使用它，如下所示：

<my-document document-path="application.documentpath" document-type="application.documenttype"></my-document>

如果 documentType 始终相同，您可以将其保留为字符串范围参数。

使用属性字符串绑定的

1 个答案: