将属性添加到对象 [Typescript] 的正确方法是什么答案

【问题标题】：What is the correct way to add a property to an Object [Typescript]将属性添加到对象 [Typescript] 的正确方法是什么
【发布时间】：2019-11-23 05:50:24
【问题描述】：

我正在学习typescript。我检查了this 和this。我尝试了许多其他解决方案。我有一个变量incomingArticleObject，该变量的类型应该是Object，并且Object 应该有一个属性content，其中content 的类型是String。这是我写的：

export class OptionsPanelComponent implements OnInit {

  incomingArticleObject : Object = { 
                            content: String };

  constructor(...) { }

  ngOnInit() {
    this.incomingArticleObject = this._articleService.getClickedArticle();
    document.querySelector('#mydiv').innerHTML=this.incomingArticleObject.content; <=== ERROR
  }
}

但我在ngOnInit 中的那一行收到此错误：

“对象”类型上不存在属性“内容”。

我也尝试创建一个interface，然后像这样分配值：

import { ... } from '@angular/core';
import ...

export interface MyObject {}

@Component({
  ...
})
export class OptionsPanelComponent implements OnInit {

  incomingArticleObject : MyObject = { 
                            content: String };

  constructor(...) { }

  ngOnInit() {
    this.incomingArticleObject = this._articleService.getClickedArticle();
    document.querySelector('#data-container').innerHTML=this.incomingArticleObject.content;
  }
}

但我仍然遇到同样的错误，vs code 中有很多带红色下划线的代码。请纠正我。

【问题讨论】：

将接口命名为 Object 以外的名称。例如：export interface IArticle {...}。然后incomingArticleObject : IArticle = {...}
@adiga。我试过。我也编辑了我的问题中的代码。它不工作。无论如何，我感谢您的帮助。
什么不起作用？首先，您将对象设置为{ content: String }。这是一个对象字面量，而不是类型定义。 String 是一个全局对象。因此，当您将其分配给 innerHTML 时，您可能会遇到错误。其次，您可能在{ content: content } 中遇到错误，因为范围内没有content 标识符。请发布确切的错误以创建minimal reproducible example
在第二个示例中，您将 content 属性设置为名为 content 的变量。那个变量是从哪里来的？
我做了一些改变。 Instaed 全局Object 现在我使用的是用户定义的MyObject。但我仍然遇到同样的错误。

标签： angular typescript object

【解决方案1】：

你可能应该这样做：

incomingArticleObject: { content?: string } = { content: '' };

在哪里

incomingArticleObject 是您的资源名称
? 使属性可选
: 是打字的标记。
{ content?: string } 是您的属性的类型，一个具有一个属性 content 的对象，期望是 string
=是做作的标志
{ content: '' } 具有一个属性的对象 content 初始化为空 string

注意，感情是可选的，如果你不这样做，那么你的属性有undefined的值，而undefined类型没有content的属性。

【讨论】：

但是现在this.incomingArticleObject 出现错误。它说：“对象”类型可以分配给很少的其他类型。您的意思是改用“任何”类型吗？ “对象”类型中缺少属性“内容”，但类型“{内容：字符串; }'.`
@Tanzeel 如果您不分配任何值，请将 content 属性设为可选。您可以使用{ content?: string } 来做到这一点
@安吉拉。不好了。我的错。我在 { content: string? } 中使用 ? 和 string?