2017-10-30 21 views
0

新しいデータを編集して挿入するために使用するフォームコンポーネントを作成しましたので、コンポーネント内のオブジェクトを表す変数を作成し、[(ngModel) ] =「schoolClass.name」、しかし、次のエラーがコンソールに表示されます。ngModelで変数にアクセスできません - 角度4

ERROR TypeError: Cannot read property 'name' of null 
    at Object.eval [as updateDirectives] (SchoolClassFormComponent.html:5) 
    at Object.debugUpdateDirectives [as updateDirectives] (core.es5.js:13067) 
    at checkAndUpdateView (core.es5.js:12251) 
    at callViewAction (core.es5.js:12599) 
    at execComponentViewsAction (core.es5.js:12531) 
    at checkAndUpdateView (core.es5.js:12257) 
    at callViewAction (core.es5.js:12599) 
    at execEmbeddedViewsAction (core.es5.js:12557) 
    at checkAndUpdateView (core.es5.js:12252) 
    at callViewAction (core.es5.js:12599) 
    at execComponentViewsAction (core.es5.js:12531) 
    at checkAndUpdateView (core.es5.js:12257) 
    at callViewAction (core.es5.js:12599) 
    at execEmbeddedViewsAction (core.es5.js:12557 

私は、次のオペレータ[(ngModel)] =「schoolClass .nameのか?」すでに使用しているが、それを使用している場合、それが表示されますこのエラー:

ZoneAwareError {__zone_symbol__error: Error: Uncaught (in promise): Error: Template parse errors: Parser Error: The '?.' operator cannot b…, …} 
message : "Uncaught (in promise): Error: Template parse errors:↵Parser Error: The '?.' operator cannot be used in the assignment at column 19 in [schoolClass?.name=$event] in ng:///SchoolClassModule/[email protected]:37 ("↵ <div class="row">↵  <div class="input-field col s12">↵  <input type="text" id="name" [ERROR ->][(ngModel)]="schoolClass?.name" name="name" class="validate">↵ .... 

これらは私のプロジェクトの要素です:

学校クラス-form.component.ts:

export class SchoolClassFormComponent implements OnInit, OnDestroy { 
    schoolClass: SchoolClass; 
    ..... 
} 

学校クラス-form.component.html:

<input type="text" id="name" [(ngModel)]="schoolClass.name" name="name" class="validate"> 

学校-class.ts:

export class SchoolClass { 

constructor( 
    private _name : string 
) { } 

..... 

get name() : string { 
    return this._name; 
} 

set name(name : string) { 
    this._name = name; 
} 
..... 
} 

私を助けてください!

+0

https://stackoverflow.com/questions/45144230/conditional-ngmodel-in -angular2 – yurzui

+0

https://github.com/angular/angular/issues/7697 – yurzui

答えて

0

schoolClassのタイプのみを設定します。 schoolClassも初期化する必要があります。

export class SchoolClassFormComponent implements OnInit, OnDestroy { 
    schoolClass: SchoolClass = new SchoolClass('Name'); // What name you want 
    ..... 
} 
+0

私はこのコンポーネントを使用して新しいデータを編集して保存するため、nullで開始しました。 –

+0

デフォルト値で初期化するか、変数を使用するタグに '* ngIf =" schoolClass "'を追加してください –

+0

さて、ここでテストします! –

0

はあなたが唯一、現在何を指すの学校のクラスの参照を持って、最初のSchoolClassクラスをインスタンス化する必要が

関連する問題