Impossibile trovare il controller "ngModel", richiesto dalla direttiva "..."

88

Cosa sta succedendo qui?

Ecco la mia direttiva:

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

          // do something
        }
    };
});

Ecco un esempio della direttiva in uso:

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

Ecco il testo dell'errore effettivo:

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

angularjs directive

— Shaun Luttin
fonte

127

Come descritto qui: Angular NgModelController , dovresti fornire il <inputcontroller richiestongModel

<input submit-required="true" ng-model="user.Name"></input>

— Radim Köhler
fonte

1

Perfetto. Lo apprezzo! Contrassegnerò questo come risposta. Ho una domanda successiva. Devo pubblicare un'altra domanda o modificare l'originale?

— Shaun Luttin

Ecco il follow-up: stackoverflow.com/questions/21807929/...

— Shaun Luttin

2

avevo digitato per errore ng-modelse ho ricevuto questo errore.

— chovy

@Radim Kohler Sono felice che la tua risposta abbia effettivamente aiutato qualcuno nel bisogno, io stesso sono vicino a raggiungere questo obiettivo. Dall'istruzione di input sopra, per l'attributo "ng-model" posso utilizzare la concatenazione di stringhe come "{{RootObjectName +". "+ ModelName}}" ?? !! Poiché i miei modelli in $ scope non sono semplici e vengono creati dinamicamente nel controller in base all'input da DB

— pavan kumar

@pavankumar controlla questo link next.plnkr.co/edit/… questo ng-model="RootObject[alias]"funzionerà se la sessione avrà `$ scope.RootObject = {}; $ scope.alias = "FirstName" `... instaead of alias, anche forEach potrebbe fornire il nome dinamico

— Radim Köhler

8

Una possibile soluzione a questo problema è l' ng-modelattributo necessario per utilizzare quella direttiva.

Quindi l'aggiunta dell'attributo "ng-model" può risolvere il problema.

<input submit-required="true" ng-model="user.Name"></input>

— Ariete
fonte

Questo ha risolto il mio. Grazie. Penso che abbiamo perso il punto che per innescare ng-change, dovrebbe esserci un legame ng-model all'elemento.

— antonD

1

Puoi anche rimuovere la linea

  require: 'ngModel',

se non è necessario ngModelin questa direttiva. La rimozione ngModelti consentirà di creare una direttiva senza ngModelquell'errore.

— a vapore
fonte

0

Ho riscontrato lo stesso errore, nel mio caso ho scritto male la direttiva ng-model qualcosa come "ng-moel"

Quello sbagliato: ng-moel = "user.name" Quello giusto: ng-model = "user.name"

— Shahidul Haque
fonte