angularjs - 要求新/隔离范围的多个指令答案

【问题标题】：angularjs - Multiple directives asking for new / isolated scopeangularjs - 要求新/隔离范围的多个指令
【发布时间】：2014-08-12 19:20:24
【问题描述】：

我有一个指令，仅在加载 iframe 后才调用函数。但是我得到多方向新/隔离范围错误。我的代码 sn-p 如下。

<iframe ng-src="{{src}}" ng-if="loginCheck" ng-show="false" data-iframe-on-load="iframeOnLoad" data-iframe-callback="testLoad()"></iframe>

js:

directive('iframeOnLoad', function () {
    return {
        restrict: 'A',
        scope: {
            callback: '&iframeCallBack'
        },
        link: function (scope, element, attrs) {
            element.on('load', function() {
                return scope.callback();
            });
        }
    };
})

控制器：

$scope.loginCheck = true;
$scope.testLoad= function () {
    alert('loaded...');
};

错误：

错误：[$compile:multidir] 多个指令 [iframeOnLoad, iframeOnLoad] 要求在

【问题讨论】：

我唯一能猜到的是你的iframeOnLoad 指令被定义了两次。
不，我的意思是，例如，包含指令声明的 JavaScript 文件可能会在脚本标签中包含两次。

标签： angularjs angularjs-directive angularjs-scope

【解决方案1】：

除了&iframeCallBack 应该是&iframeCallback 之外，您发布的代码没有问题。否则考虑将data-iframe-callback="testLoad()" 更改为data-iframe-call-back="testLoad()"。

问题的可能原因是您通过复制粘贴指令的现有代码创建了多个指令，而忘记将指令的名称更改为新的。只需在您的代码中搜索iframeOnLoad，我很确定您会找到两个具有此类名称的指令。

这是因为 AngularJS 允许注册多个具有相同名称的指令。此模式可用于扩展指令的现有功能。但是，您只能为一个 DOM 元素创建一个隔离作用域，因此需要隔离作用域的两个同名指令是矛盾的。

工作示例见here。

转载了与你相同的问题here。

【讨论】：

我明白你所说的，你是对的。我重命名了我的指令并且它起作用了。谢谢！！！

【解决方案2】：

我认为问题与两个指令的名称不同，问题的原因是多个指令在一个元素中同时设置隔离范围。

【讨论】：

请尝试发布答案。
即使指令的名称不同，一个作用域是隔离的，另一个作用域是真的或隔离的也会出错，所以原因是作用域设置，指令的名称不同，我的英文不好，见谅！
我已将其添加到您的答案中，希望对您有所帮助。