控制器'ngModel',由指令所要求的“...”,无法找到 [英] Controller 'ngModel', required by directive '…', can't be found
问题描述
这是怎么回事?
下面是我的指令:
// template <input ng-model="theModel" />
app.directive('bseInput', function () {
return {
templateUrl: "/Scripts/bse/bse-inputs.html",
scope:
{
theModel: '=',
},
compile: function compile(tElement, tAttrs, transclude) {
// do stuff
}
};
});
app.directive('submitRequired', function (objSvc) {
return {
require: 'ngModel',
link: function (scope, elm, attrs, ctrl) {
// do something
}
};
});
下面是使用中的指令的一个例子:
Here is an example of the directive in use:
<input bse-input submit-required="true" the-model="someModel"></input>
下面是实际的错误文本:
Here is the actual error text:
错误:[$编译:ctreq]控制器ngModel,由指令所要求的'submitRequired,无法找到!
<一href=\"http://errors.angularjs.org/1.2.2/\">http://errors.angularjs.org/1.2.2/$compile/ctreq?p0=ngModel&p1=submitRequired
在<一个href=\"http://www.domain.ca/Scripts/angular/angular.js:78:12\">http://www.domain.ca/Scripts/angular/angular.js:78:12
在getControllers(<一个href=\"http://www.domain.ca/Scripts/angular/angular.js:5972:19\">http://www.domain.ca/Scripts/angular/angular.js:5972:19)
在nodeLinkFn(<一个href=\"http://www.domain.ca/Scripts/angular/angular.js:6139:35\">http://www.domain.ca/Scripts/angular/angular.js:6139:35)
在compositeLinkFn(<一个href=\"http://www.domain.ca/Scripts/angular/angular.js:5550:15\">http://www.domain.ca/Scripts/angular/angular.js:5550:15)
在nodeLinkFn(<一个href=\"http://www.domain.ca/Scripts/angular/angular.js:6132:24\">http://www.domain.ca/Scripts/angular/angular.js:6132:24)
在compositeLinkFn(<一个href=\"http://www.domain.ca/Scripts/angular/angular.js:5550:15\">http://www.domain.ca/Scripts/angular/angular.js:5550:15)
在publicLinkFn(<一个href=\"http://www.domain.ca/Scripts/angular/angular.js:5458:30\">http://www.domain.ca/Scripts/angular/angular.js:5458:30)
在<一个href=\"http://www.domain.ca/Scripts/angular/angular.js:1299:27\">http://www.domain.ca/Scripts/angular/angular.js:1299:27
在范围内。$ get.Scope。$的eval(<一个href=\"http://www.domain.ca/Scripts/angular/angular.js:11634:28\">http://www.domain.ca/Scripts/angular/angular.js:11634:28)
在范围内。$ get.Scope。$应用(<一个href=\"http://www.domain.ca/Scripts/angular/angular.js:11734:23\">http://www.domain.ca/Scripts/angular/angular.js:11734:23) angular.js:9159
(匿名函数)angular.js:9159
$得到angular.js:6751
nodeLinkFn angular.js:6141
compositeLinkFn angular.js:5550
nodeLinkFn angular.js:6132
compositeLinkFn angular.js:5550
publicLinkFn angular.js:5458
(匿名函数)angular.js:1299
。$ get.Scope $ EVAL angular.js:11634
。$ get.Scope $适用angular.js:11734
(匿名函数)angular.js:1297
调用angular.js:3633
doBootstrap angular.js:1295
引导angular.js:1309
angularInit angular.js:1258
(匿名函数)angular.js:20210
触发angular.js:2315
(匿名函数)angular.js:2579
的forEach angular.js:300
事件处理angular.js:2578ar.js:7874
Error: [$compile:ctreq] Controller 'ngModel', required by directive 'submitRequired', can't be found! http://errors.angularjs.org/1.2.2/$compile/ctreq?p0=ngModel&p1=submitRequired at http://www.domain.ca/Scripts/angular/angular.js:78:12 at getControllers (http://www.domain.ca/Scripts/angular/angular.js:5972:19) at nodeLinkFn (http://www.domain.ca/Scripts/angular/angular.js:6139:35) at compositeLinkFn (http://www.domain.ca/Scripts/angular/angular.js:5550:15) at nodeLinkFn (http://www.domain.ca/Scripts/angular/angular.js:6132:24) at compositeLinkFn (http://www.domain.ca/Scripts/angular/angular.js:5550:15) at publicLinkFn (http://www.domain.ca/Scripts/angular/angular.js:5458:30) at http://www.domain.ca/Scripts/angular/angular.js:1299:27 at Scope.$get.Scope.$eval (http://www.domain.ca/Scripts/angular/angular.js:11634:28) at Scope.$get.Scope.$apply (http://www.domain.ca/Scripts/angular/angular.js:11734:23) angular.js:9159 (anonymous function) angular.js:9159 $get angular.js:6751 nodeLinkFn angular.js:6141 compositeLinkFn angular.js:5550 nodeLinkFn angular.js:6132 compositeLinkFn angular.js:5550 publicLinkFn angular.js:5458 (anonymous function) angular.js:1299 $get.Scope.$eval angular.js:11634 $get.Scope.$apply angular.js:11734 (anonymous function) angular.js:1297 invoke angular.js:3633 doBootstrap angular.js:1295 bootstrap angular.js:1309 angularInit angular.js:1258 (anonymous function) angular.js:20210 trigger angular.js:2315 (anonymous function) angular.js:2579 forEach angular.js:300 eventHandler angular.js:2578ar.js:7874
推荐答案
以防万一,那上面&LT;输入&GT;
段不包含一个错字,这是问题:
Just in case, that the above <input>
snippet does not contain a typo, this is the issue:
the-model
我们需要 NG-模型
<input bse-input submit-required="true" ng-model="someModel.Property"></input>
角是使用标准化/非规范化命名约定,这在年底的意思是: NG-模型
是HTML的方式如何前preSS的 ngModel
。 HTML是不区分大小写...这解决了这个问题。
angular is using normalized/denormalized naming conventions, which at the end means: ng-model
is the html way how to express the ngModel
. HTML is case insensitive... and this solves this issue
建议。如果我们有多个指令,工作应用到一个元素:
Suggestion. If we are working with multiple directives applied to one element:
- BSE-输入
- 提交要求的
我们应该让他们两人用的标准的输入设置工作。所以,既要能需要纳克的模型,作为方式如何访问传递到输入模型。
We should let both of them to work with a standard INPUT settings. So, both should could require ng-model, as a way how to access the model passed to input.
如果该模型应重新presenting不同的设置,这是绝对OK,我们只是没有跳过传递NG-模式以及
if the-model should be representing different setting, which is absolutely ok, we just do not have to skip passing the ng-model as well
关于要求
:
当你嵌套需要相互沟通的指令,顺便
做到这一点是通过一个控制器。
When you have nested directives that need to communicate with each other, the way to do this is through a controller.
其他指令可以有这个控制器传递给它们的性能要求
句法。都需要完整的形式如下:
Other directives can have this controller passed to them with the require property syntax. The full form of require looks like:
require: '^?directiveName'
在需要字符串说明:
Explanations of the require string:
-
directiveName
:这骆驼套管名指定哪些指令控制器应从何而来。所以,如果我们的
指令需要找到其父控制器,我们希望把它写成MYMENU。 -
^
默认情况下,角会从同一个元素上的命名指令的控制器。添加此可选
^符号表示,也走了DOM树找到该指令。对于本例中,我们需要
添加这个符号;最后一个字符串将是\\ ^ MYMENU。 -
?
如果没有找到所需的控制器,角将抛出一个异常,告诉你有关的问题。添加
一个 ?符号的字符串表示,该控制器是可选的,并且,如果不异常应不被拆毁
找到。虽然这听起来不太可能,如果我们想令s没有被使用
容器,我们可以添加此作最后需要字符串?\\ ^ MYMENU。
directiveName
: This camel-cased name specifies which directive the controller should come from. So if our directive needs to find a controller on its parent , we’d write it as myMenu.^
By default, Angular gets the controller from the named directive on the same element. Adding this optional ^ symbol says to also walk up the DOM tree to find the directive. For the example, we’d need to add this symbol; the final string would be \^myMenu.?
If the required controller is not found, Angular will throw an exception to tell you about the problem. Adding a ? symbol to the string says that this controller is optional and that an exception shouldn’t be thrown if not found. Though it sounds unlikely, if we wanted to let s be used without a container, we could add this for a final require string of ?\^myMenu.
这篇关于控制器'ngModel',由指令所要求的“...”,无法找到的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!