Question

我正在开发一个指令，其内容根据属性而变化。因此，如果我在页面中有多个指令，则隔离范围不起作用，即两个指令具有相同的值。仅当指令中存在服务调用且没有服务和承诺时隔离范围才起作用时，才会发生这种情况。

指令

.directive('ex', function() {
return {
    restrict: 'E',
    scope: {},
    template: '<div>Test{{test}}</dic>',
    link: function(scope, elem, attr) {
        if(attr.label == 'dir1') {
            scope.test = 'Directive 1';
        }
        if(attr.label == 'dir2') {
            scope.test = 'Directive 2';
        }
    }
}
})

，HTML是

<ex label="directive1"></ex>
<ex label="directive2"></ex>

输出

Directive 1
Directive 2

这很有效，但是当我在指令中进行http服务调用时，如果范围值取决于它，我得到的输出错误，如

Directive 1 Directive 1

请帮助我找出在指令中使用服务调用时隔离范围无效的原因。

非常感谢任何帮助。感谢

修改

带有$ http的指令代码

.directive('ex', ['Service', function(Service) {
return {
    restrict: 'E',
    scope: {},
    template: '<div>Test{{test}}</dic>',
    link: function(scope, elem, attr) {
        Service.getData(attr.label).then(function(response) {
          if(response.data.value == 'Testing') {
            scope.test = 'Directive 1';
          } else {
            scope.test = 'Directive 2';
          }
        })

    }
}
}])

Angular JS隔离范围不适用于带有服务调用的指令

0 个答案: