只要我真的通過使用* ngIf結構指令來使輸入字段有條件可用。不能在輸入字段中使用* ngIf
<form>
<input *ngIf='true' #inputName [(ngModel)]='log' name='ex1'/>
<button (click)='logMe(inputName.value)'>Click</button>
</form>
其中inputName
未定義,並顯示錯誤。 此plunkr重新創建錯誤:here。
我不明白爲什麼這個錯誤會出現,因爲* ngIf中的條件是真的。這意味着輸入字段的DOM元素已創建,並且我們可以在輸入字段中輸入內容時看到模型得到更新。但是,拋出的錯誤表明就好像輸入字段不存在一樣。
堆棧跟蹤:
EXCEPTION: Error in ./App class App - inline template:3:2 caused by: Cannot read property 'value' of undefined
ErrorHandler.handleError @ core.umd.js:3064
next @ core.umd.js:8041
schedulerFn @ core.umd.js:3689
SafeSubscriber.__tryOrUnsub @ Subscriber.ts:238
SafeSubscriber.next @ Subscriber.ts:190
Subscriber._next @ Subscriber.ts:135
Subscriber.next @ Subscriber.ts:95
Subject.next @ Subject.ts:61
EventEmitter.emit @ core.umd.js:3675
NgZone.triggerError @ core.umd.js:4040
onHandleError @ core.umd.js:4001
ZoneDelegate.handleError @ zone.js:246
Zone.runTask @ zone.js:154
ZoneTask.invoke @ zone.js:345
core.umd.js:3066 ORIGINAL EXCEPTION: Cannot read property 'value' of undefined
ErrorHandler.handleError @ core.umd.js:3066
next @ core.umd.js:8041
schedulerFn @ core.umd.js:3689
SafeSubscriber.__tryOrUnsub @ Subscriber.ts:238
SafeSubscriber.next @ Subscriber.ts:190
Subscriber._next @ Subscriber.ts:135
Subscriber.next @ Subscriber.ts:95
Subject.next @ Subject.ts:61
EventEmitter.emit @ core.umd.js:3675
NgZone.triggerError @ core.umd.js:4040
onHandleError @ core.umd.js:4001
ZoneDelegate.handleError @ zone.js:246
Zone.runTask @ zone.js:154
ZoneTask.invoke @ zone.js:345
core.umd.js:3069 ORIGINAL STACKTRACE:
ErrorHandler.handleError @ core.umd.js:3069
next @ core.umd.js:8041
schedulerFn @ core.umd.js:3689
SafeSubscriber.__tryOrUnsub @ Subscriber.ts:238
SafeSubscriber.next @ Subscriber.ts:190
Subscriber._next @ Subscriber.ts:135
Subscriber.next @ Subscriber.ts:95
Subject.next @ Subject.ts:61
EventEmitter.emit @ core.umd.js:3675
NgZone.triggerError @ core.umd.js:4040
onHandleError @ core.umd.js:4001
ZoneDelegate.handleError @ zone.js:246
Zone.runTask @ zone.js:154
ZoneTask.invoke @ zone.js:345
core.umd.js:3070 TypeError: Cannot read property 'value' of undefined
at CompiledTemplate.proxyViewClass.View_App0.handleEvent_5 (VM5226 component.ngfactory.js:189)
at CompiledTemplate.proxyViewClass.eval (core.umd.js:12399)
at HTMLButtonElement.eval (platform-browser.umd.js:3224)
at ZoneDelegate.invokeTask (zone.js:275)
at Object.onInvokeTask (core.umd.js:3971)
at ZoneDelegate.invokeTask (zone.js:274)
at Zone.runTask (zone.js:151)
at HTMLButtonElement.ZoneTask.invoke (zone.js:345)
ErrorHandler.handleError @ core.umd.js:3070
next @ core.umd.js:8041
schedulerFn @ core.umd.js:3689
SafeSubscriber.__tryOrUnsub @ Subscriber.ts:238
SafeSubscriber.next @ Subscriber.ts:190
Subscriber._next @ Subscriber.ts:135
Subscriber.next @ Subscriber.ts:95
Subject.next @ Subject.ts:61
EventEmitter.emit @ core.umd.js:3675
NgZone.triggerError @ core.umd.js:4040
onHandleError @ core.umd.js:4001
ZoneDelegate.handleError @ zone.js:246
Zone.runTask @ zone.js:154
ZoneTask.invoke @ zone.js:345
core.umd.js:3073 ERROR CONTEXT:
我真的不明白你想在這裏做什麼做的。你想在點擊按鈕後用「name」填充輸入內容? –
這只是我在嘗試動態插入/刪除表單內的輸入字段時得到的錯誤的重新創建。點擊按鈕就是在那裏顯示模型得到更新,即使控件拋出未定義的錯誤 –
@GünterZöchbauer我很好奇,與這個問題有關,爲什麼'* ngIf'使得inputName在一起使用時未定義??我以爲你可能知道......因爲......你知道一切:D:D我自己試着篩選文檔,但是我找不到任何有用的東西。如果您刪除了* ngIf,則代碼OP將完全正常工作。請告訴我爲什麼,並殺死我的好奇:) – Alex