使用 = vs 分配 TypeScript 属性值：答案

【问题标题】：Assigning TypeScript property values with = vs :使用 = vs 分配 TypeScript 属性值：
【发布时间】：2022-01-11 05:13:49
【问题描述】：

我有以下Angular 组件：

@Component({
  ...
  template: `
  <div>{{getDisplayValue(value)}}</div>
  <button (click)="value= { display: 'one' }">1</button>
  <button (click)="value.display = 'two'">2</button>`
})
export class TestProblemButtonClickComponent implements OnInit {

  public value = {display: 'old'};

  public getDisplayValue(value): string {
    return value.display;
  }

  ...
}

为什么在声明public value 属性后使用=？我习惯于看到属性后跟:，然后是值。如果我将= 更改为:，当我单击按钮2 时会出现一些错误。如果进入value 属性的对象并将dislay 之后的: 更改为=，代码甚至没有运行，我收到以下错误：Did you mean to use a ':'? An '=' can only follow a property name when the containing object literal is part of a destructuring pattern.

谁能告诉我这个？

【问题讨论】：

标签： angular typescript class object properties

【解决方案1】：

您似乎对以下内容感到困惑：

JavaScript 类成员分配 (public value = something)
JS对象键值赋值({display: 'old'})
TypeScript 变量类型声明 (public value: valueType)
JavaScript "{display = 'old'}" 没有任何意义，除非在使用默认值解构函数参数的上下文中

【讨论】：