多個指令[指令＃1，指令＃2]要求隔離作用域

我試圖在已經存在的指令的基礎上構建一個新的指令，但在進程中停止。當加載頁面，我面臨着以下錯誤：多個指令[指令＃1，指令＃2]要求隔離作用域

Multiple directives [directive#1, directive#2] asking for isolated scope on <easymodal title="Test-Title" text="Text-Text" oncancel="show = false" onok="alert();">

基礎指令如下：

Rohan.directive('easymodal', function() { 
    return { 
     restrict: 'E', 
//  priority: 200, 
     transclude: true, 
     replace: true, 
     scope:{ 
      showModal: "=show", 
      callback: "=closeFunction", 
      dismissable: '&' 
     }, 
     template: 
      '<div data-ng-show="showModal" class="modal-container">' + 
       '<div class="modal-body">' + 
        '<div class="title"><span data-translate></span><a data-ng-show="dismissable" data-ng-click="dismiss()">x</a></div>' + 
        '<div data-ng-transclude></div>' + 
       '</div>' + 
       '<div class="modal-backdrop" data-ng-click="dismiss()"></div>' + 
      '</div>' 
    }; 
});

而且我的包裝指令看起來像這樣：

Rohan.directive('easydialog', function() { 
    return { 
     restrict: 'E', 
     transclude: true, 
     scope: {title: '@', 
      text: '@', 
      onOk: '&', 
      onCancel: '&'}, 
     replace: true, 
     template: 
      '<easymodal>' + 
       '{{text}} ' + 
       '<hr>' + 
       '<button ng-click="{{onCancel}}" value="Cancel"' + 
       '<button ng-click="{{onOk}}" value="Ok"' + 
      '</easymodal>' 
    }; 
});

我的HTML看起來像這樣：

<easydialog title="Test-Title" text="Text-Text" onCancel="show = false" onOk="alert();" />

起初我雖然我的標題屬性是衝突的，所以我在html行和我的包裝指令中刪除了該屬性，但它不是有效的。

來源

2013-04-22 Rohan

可以請你設置小提琴 – 2013-04-22 13:29:35

您需要更改您的easydialog模板並將<easymodal>換成<div>。

來源

2013-04-22 13:28:58 Langdon

謝謝，我從來沒有想到。 – Rohan 2013-04-23 07:28:43

你能詳細說明一下嗎？首先是什麼問題，以及如何將它們封裝在一個div中修復它？ – masimplo 2013-12-04 09:49:22

@ mxa055我相信Angular會將HTML元素關聯到作用域，並且不能將單個HTML元素關聯到多個作用域。 – Langdon 2013-12-04 20:15:45

您的問題僅僅是您在directive中添加了template參數，並且在實際的HTML模板中添加了名爲<easydialog>的解析模板標記。您可以選擇其中一個或另一個。

來源

2013-09-12 22:21:16 kaiser

多個指令[指令＃1，指令＃2]要求隔離作用域

回答

相關問題