我正在学习 Angular，在学习自定义指令时，我陷入了一种不知道如何解决的情况。这是我的自定义指令:
/**
* Created by Lucas on 11/06/2015.
*/
'use strict'
eventsApp
.directive('greeting',function() {
return {
restrict: 'E',
replace: true,
template: "<button class='btn' ng-click='sayHello()'>Say Hello</button>",
controller: function GreetingController($scope) {
var greetings = ['hello'];
$scope.sayHello = function() {
alert(greetings.join());
}
this.addGreeting = function(greeting) {
greetings.push(greeting);
}
}
};
})
.directive('finnish',function() {
return {
restrict: 'A',
require: 'greeting',
link: function(scope, element, attrs, controller) {
controller.addGreeting('hei');
}
}
})
.directive('hindi',function() {
return {
restrict: 'A',
require: 'greeting',
link: function(scope, element, attrs, controller) {
controller.addGreeting('नमस्ते');
}
}
});这些指令工作正常，但是，如果我将 greeting Controller 更改为通过如下属性接收外部 Controller :
.directive('greeting',function() {
return {
restrict: 'E',
replace: true,
template: "<button class='btn' ng-click='sayHello()'>Say Hello</button>",
controller: '@',
name: 'ctrl'
};
})然后像这样在 HTML 中引用:
<!DOCTYPE html>
<html ng-app="eventsApp">
<head lang="en">
<meta charset="UTF-8">
<title>Event Registration</title>
<link rel="stylesheet" href="css/bootstrap.min.css"/>
<link rel="stylesheet" href="css/app.css"/>
</head>
<body>
<greeting ctrl="GreetingController">
<div finnish hindi></div>
</greeting>
<script src="lib/jquery.min.js"></script>
<script src="lib/angular/angular.js"></script>
<script src="lib/angular/angular-resource.js"></script>
<script src="lib/angular/angular-route.min.js"></script>
<script src="lib/underscore-1.4.4.min.js"></script>
<script src="js/app.js"></script>
<script src="js/controllers/GreetingController.js"></script>
<script src="js/directives/greeting.js"></script>
<script src="js/filters.js"></script>
<script src="lib/bootstrap.min.js"></script>
</body>
</html>其他指令停止工作， Angular 记录以下错误:
错误:[$compile:ctreq] 无法找到指令“hindi”所需的 Controller “greeting”!
我想有办法解决这个问题，但由于我是 Angular 的新手，所以我有点不知所措。
最佳答案
如果您将 Controller 作为属性获取，则属性名称需要是指令的名称:
<greeting greeting="GreetingController" finnish="" hindi=""></greeting>
参见 this傻瓜
关于javascript - 需要另一个使用属性定义 Controller 的指令的 Angular 指令，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/30829863/