각도 UI 모달 내에서 사용할 수있는 지시문을 만들어야합니다. 이 지시어는 모달 컨트롤러를 사용하기 위해 모달 컨트롤러에 대해서도 알아야한다. 나는 지금 무엇을 가지고 :각도 UI 모달 컨트롤러가 지시문에 표시되지 않습니다.
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
오류가 발생되지 않은 : 나는에 노력 value = value || $element[retrievalMethod]('$' + require + 'Controller');
, 그래서 : getControllers()
곳 angular.js
에서 LOC 6433의 주위에 컨트롤러를 검색하는 데 사용됩니다
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">
내가 코드를 디버깅하려고 ModalController
대신 Modal
이 필요하지만 (Controller
은 Angular로 추가됩니다) 도움이되지 않습니다. $element[retrievalMethod]
가 어떻게 작동하는지 이해할 수는 없지만 저수준에 해당됩니다. 그래서, 나는 붙어있어 어떤 도움을 주셔서 감사합니다.
Plunk을 만들었으므로 콘솔에서 놀고 볼 수 있습니다.
지시문은 링크 함수에 전달 된 범위를 통해 ModalController의 $ scope에있는 함수에 액세스 할 수 있습니다. 또는 누락 된 다른 사용 사례에 해당합니까? – tasseKATT
또한,'require'는 컨트롤러에 접근하고자하는 지시자의 이름을 취합니다, 그래서 컨트롤러 이름을 지정하면 작동하지 않을 것입니다. 콧대가 말하듯이 '범위'만 사용하십시오. –
@AnthonyChu 나는 확실히 그것을 워드 프로세서에서 놓친 것을 지적 해 주신 것에 감사드립니다! – madhead