タイプ '{}'はタイプ '{title：string;テキスト：文字列。 }「私は活字体コード以下のエラーの下に取得しています

Question

は、

タイプは、 『{} {タイトル』型に代入できません」：文字列;テキスト：文字列。 } '。タイプ '{}'にプロパティ 'title'がありません。

私はその理由とどのようにこれを解決するには何以下のような「記事」、

article: { title: string, text: string } = {}; 

を宣言していたよう？ありがとう！

import { Component } from '@angular/core'; 
 
import { FormControl, FormGroup, Validators } from '@angular/forms'; 
 

 
@Component({ 
 
    selector: 'article-editor', 
 
    template: ` 
 
    <p>Title: <input [formControl]="titleControl"></p> 
 
    <p>Text: <input [formControl]="textControl"></p> 
 
    <p><button (click)="saveArticle()">Save</button></p> 
 
    <hr /> 
 
    <p>Preview:</p> 
 
    <div style="border:1px solid #999;margin:50px;"> 
 
     <h1>{{article.title}}</h1> 
 
     <p>{{article.text}}</p> 
 
    </div> 
 
    ` 
 
}) 
 
export class ArticleEditorComponent { 
 
    article: { title: string, text: string } = {}; 
 

 
    titleControl: FormControl = new FormControl(null, Validators.required); 
 
    textControl: FormControl = new FormControl(null, Validators.required); 
 
    articleFormGroup: FormGroup = new FormGroup({ 
 
     title: this.titleControl, 
 
     text: this.textControl 
 
    }); 
 

 
    saveArticle() { 
 
     if (this.articleFormGroup.valid) { 
 
      this.article = this.articleFormGroup.value; 
 
     } else { 
 
      console.log('Missing field(s)!'); 
 
     } 
 
    } 
 
}

Answer 1

あなたはarticleはタイプ{ title: string, text: string }であることをコンパイラに言いましたが、その後、あなたはtitleとtextの両方を欠いているので、コンパイラは文句空のオブジェクト（{}）を割り当てます。

あなたは、それは大丈夫だ、コンパイラに指示するタイプのアサーションを使用することができます。その後、

type MyType = { title: string, text: string }; 
let article: MyType = {} as MyType; 

そして、あなたは、型アサーションを使用しているよう：

let article: { title: string, text: string } = {} as { title: string, text: string }; 

また、タイプの別名にあることを置くことができます

let article = {} as MyType; 

Answer 2

articleには01が必要ですとtextフィールドですが、{}フィールドはありません。それを解決するには、articleに初期値が表示されている間に表示する内容によって異なりますが、最も単純な修正はフィールドをオプションにすることです：{ title?: string, text?: string }。