Angular UI Modal控制器沒有暴露於指令

我需要創建一個可以在Angular UI模式中使用的指令。該指令還需要了解模態控制器以便使用它的一些功能。我現在擁有的一切：Angular UI Modal控制器沒有暴露於指令

JS：

'use strict'; 

var DemoApp = angular.module('DemoApp', [ 'ui.bootstrap' ]); 

DemoApp.controller('PageController', ['$scope', '$modal', function($scope, $modal){ 
    $scope.openModal = function(){ 
    var scope = $scope.$new(true); 

    $modal.open({ 
     'templateUrl' : 'modal.html', 
     'controller' : 'ModalController', 
     'scope' : scope 
    }); 
    } 
}]); 

DemoApp.controller('ModalController', ['$scope', '$modalInstance', function($scope, $modalInstance){ 
    $scope.ok = function() { 
    $modalInstance.dismiss(); 
    }; 

    $scope.cancel = function() { 
    $modalInstance.dismiss(); 
    }; 
}]); 

DemoApp.directive('expression', function() { 
    return { 
    restrict : 'A', 
    require : ['ngModel', '^ModalController'], 
    link : function(scope, element, attrs, controllers) { 
     console.log(arguments); 
    } 
    }; 
});

莫代爾模板：

<div class="modal-header"> 
    <h3>Test!</h3> 
</div> 
<div class="modal-body"> 
    <input data-ng-model="someValue" expression>{{someValue}} 
</div> 
<div class="modal-footer"> 
    <button class="btn btn-primary" data-ng-click="ok()">Ok</button> 
    <button class="btn btn-warning" data-ng-click="cancel()">Cancel</button> 
</div>

，紅色按鈕：

<button id="demoButton" class="btn btn-primary" data-ng-click="openModal()">Click me!</button>

但是，創建ModalController模態時沒有解決，我也得到$compile:ctreq錯誤：

Error: [$compile:ctreq] http://errors.angularjs.org/1.2.17/$compile/ctreq?p0=ModalController&p1=expression 
    at Error (native) 
    at http://ajax.googleapis.com/ajax/libs/angularjs/1.2.17/angular.min.js:6:450 
    at D (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.17/angular.min.js:51:80) 
    at http://ajax.googleapis.com/ajax/libs/angularjs/1.2.17/angular.min.js:51:137 
    at Array.forEach (native) 
    at q (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.17/angular.min.js:7:280) 
    at D (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.17/angular.min.js:51:114) 
    at N (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.17/angular.min.js:54:128) 
    at g (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.17/angular.min.js:47:82) 
    at g (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.17/angular.min.js:47:99) <input data-ng-model="someValue" expression="" class="ng-pristine ng-valid">

我試着調試代碼：getControllers()某處angular.js圍繞6433 LOC用於搜索控制器：value = value || $element[retrievalMethod]('$' + require + 'Controller');，所以我試圖需要Modal而不是ModalController（Controller附加Angular），但它沒有幫助。我不明白$element[retrievalMethod]是如何工作的（進入它，但它是低層次的）。所以，我卡住了，並感謝任何幫助。

我創建了一個Plunk，所以您可以在控制檯上播放並查看我的意思。

來源

2014-06-09 madhead

該指令將通過傳遞給鏈接函數的作用域訪問ModalController的$ scope上的函數。或者，這是爲了我失蹤的其他用例嗎？ – tasseKATT

另外，'require'需要一個您想要訪問的控制器的指令的名稱，因此指定控制器名稱將不起作用。正如tasselKATT所建議的那樣，只需使用'範圍'即可。 –

@AnonyChu我肯定錯過了文檔，感謝您指點！ – madhead

請，結賬更新plunker：

ModalController範圍不是PageController子範圍，所以如果你需要將變量傳遞給ModalController您應該通過直接解析相關做到這一點。
在您的指令中，您可以將範圍設置爲ModalController作用域的子項，以便您可以訪問在那裏定義的函數，而不需要ModalController。

來源

2014-06-09 16:27:32 dubadub

哇，太簡單了！我的任務過於複雜！謝謝。 – madhead

Angular UI Modal控制器沒有暴露於指令

回答

相關問題