Controlador 'ngModel', exigido pela diretiva '...', não pode ser encontrado

88

O que está acontecendo aqui?

Aqui está minha diretriz:

app.directive('submitRequired', function (objSvc) {
    return {
        require: 'ngModel',
        link: function (scope, elm, attrs, ctrl) {

          // do something
        }
    };
});

Aqui está um exemplo da diretiva em uso:

<input submit-required="true"></input>

Aqui está o texto do erro real:

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) <input submit-required="true"> 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
Shaun Luttin
fonte

Respostas:

126

Conforme descrito aqui: Angular NgModelController , você deve fornecer o <inputcom o controlador necessáriongModel

<input submit-required="true" ng-model="user.Name"></input>
Radim Köhler
fonte
1
Perfeito. Obrigado! Vou marcar isso como resposta. Eu tenho uma questão de acompanhamento. Devo postar outra pergunta ou mudar meu original?
Shaun Luttin de
Aqui está o acompanhamento: stackoverflow.com/questions/21807929/…
Shaun Luttin
2
Eu tinha digitado por engano ng-modelse recebi este erro.
chovy de
@Radim Kohler Fico feliz que sua resposta realmente tenha ajudado alguém necessitado, estou perto de conseguir isso. A partir da instrução de entrada acima, para o atributo "ng-model", posso usar a concatenação de string como "{{RootObjectName +". "+ ModelName}}" ?? !! Como meus modelos no $ scope não são simples e são criados dinamicamente no controlador com base na entrada do DB
pavan kumar
@pavankumar verifique este link next.plnkr.co/edit/… isso ng-model="RootObject[alias]"funcionará se a sessão tiver `$ scope.RootObject = {}; $ scope.alias = "FirstName" `... em vez de alias, mesmo forEach poderia fornecer o nome dinâmico
Radim Köhler
8

Uma possível solução para esse problema é o ng-modelatributo é necessário para usar essa diretiva.

Portanto, adicionar o atributo 'ng-model' pode resolver o problema.

<input submit-required="true" ng-model="user.Name"></input>
RAM
fonte
Isso resolveu o meu. Obrigado. Acho que perdemos o ponto de que, para acionar a mudança do ng, deve haver uma vinculação do modelo do ng ao elemento.
antonD
1

Você também pode remover a linha

  require: 'ngModel',

se você não precisa ngModelnesta diretiva. A remoção ngModelpermitirá que você faça uma diretiva sem esse ngModelerro.

movido a vapor
fonte
0

Eu enfrentei o mesmo erro, no meu caso eu escrevi incorretamente a diretiva ng-model algo como "ng-moel"

Errado: ng-moel = "user.name" Correto: ng-model = "user.name"

insira a descrição da imagem aqui

Shahidul Haque
fonte