ไม่พบคอนโทรลเลอร์ 'ngModel' ที่จำเป็นโดยคำสั่ง '…'


88

เกิดอะไรขึ้นที่นี่?

นี่คือคำสั่งของฉัน:

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

          // do something
        }
    };
});

นี่คือตัวอย่างของคำสั่งที่ใช้:

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

นี่คือข้อความแสดงข้อผิดพลาดที่แท้จริง:

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

คำตอบ:


127

ตามที่อธิบายไว้ที่นี่: Angular NgModelControllerคุณควรจัดเตรียม<inputคอนโทรลเลอร์ที่จำเป็นngModel

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

1
สมบูรณ์แบบ. ฉันขอขอบคุณที่! ฉันจะทำเครื่องหมายนี้เป็นคำตอบ ฉันมีคำถามติดตามผล ฉันควรโพสต์คำถามอื่นหรือเปลี่ยนต้นฉบับของฉัน?
Shaun Luttin

ติดตามได้ที่นี่: stackoverflow.com/questions/21807929/…
Shaun Luttin

2
ฉันพิมพ์ผิดพลาดng-modelsและได้รับข้อผิดพลาดนี้
chovy

@Radim Kohler ฉันดีใจที่คำตอบของคุณช่วยคนที่ต้องการความช่วยเหลือฉันเองก็ใกล้จะบรรลุสิ่งนี้แล้ว จากคำสั่งอินพุตด้านบนสำหรับแอตทริบิวต์ "ng-model" ฉันสามารถใช้การต่อสายอักขระเช่น "{{RootObjectName +". "+ ModelName}}" ได้หรือไม่ !! เนื่องจากโมเดลของฉันในขอบเขต $ ไม่ตรงไปตรงมาและถูกสร้างขึ้นแบบไดนามิกในคอนโทรลเลอร์ตามอินพุตจาก DB
pavan kumar

@pavankumar ตรวจสอบลิงค์นี้next.plnkr.co/edit/…ซึ่งng-model="RootObject[alias]"จะใช้งานได้หากเซสชันมี `$ scope.RootObject = {}; $ scope.alias = "FirstName" `... instaead ของนามแฝงแม้forEachสามารถให้ชื่อไดนามิก
Radim Köhler

8

วิธีแก้ไขปัญหานี้วิธีหนึ่งที่เป็นไปได้คือng-modelแอตทริบิวต์จำเป็นต้องใช้คำสั่งนั้น

ดังนั้นการเพิ่มแอตทริบิวต์ "ng-model" สามารถแก้ไขปัญหาได้

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

สิ่งนี้แก้ไขของฉัน ขอบคุณ. ฉันคิดว่าเราพลาดจุดที่จะทริกเกอร์ ng-change ควรมีการโยง ng-model เข้ากับองค์ประกอบ
antonD

1

คุณยังสามารถลบเส้น

  require: 'ngModel',

หากคุณไม่ต้องการngModelคำสั่งนี้ การนำออกngModelจะช่วยให้คุณสร้างคำสั่งได้โดยไม่มีngModelข้อผิดพลาดนั้น


0

ฉันพบข้อผิดพลาดเดียวกันในกรณีของฉันฉันสะกดคำสั่ง ng-model ผิดบางอย่างเช่น "ng-moel"

ผิด: ng-moel = "user.name" อันที่ ถูก: ng-model = "user.name"

ป้อนคำอธิบายภาพที่นี่

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.