TypeScript getter/setter 中的部分答案

【问题标题】：Partials in TypeScript getters/settersTypeScript getter/setter 中的部分
【发布时间】：2018-05-11 11:22:48
【问题描述】：

在 Angular 中，我允许组件输入用于设置选项，例如 IOptions 类型在 setter 中，它不必是完整的，因为它会与默认选项合并，因此输入为 Partial<IOptions>。

const DEFAULT_OPTIONS = { prop1: false, prop2: 123 };

export class MyComponent {
  _options: IOptions;

  get options(): IOptions {
    return this._options;
  }

  @Input('config')
  set options(userOptions: Partial<IOptions>) {
    this._options = { ...DEFAULT_OPTIONS, ...userOptions };
  }
}

另一方面，getter 总是期望返回一个完整的，而不是部分的，对象，所以类型是IOptions。但是编译器抱怨 getter 和 setter 没有相同的类型。我该如何解决？

【问题讨论】：

删除Partial<>
你不能真的那样做，getter 和 setter 应该有相同的类型。你可以创建一个setOptions 方法。
@TitianCernicova-Dragomir 没错。遗憾的是，setOptions 不适用于 Angular 数据绑定。
删除 Partial<> 是一种答案，因为它确实解决了问题，但它与 Partial 的含义相矛盾（或者至少我如何理解它的目的）。

标签： angular typescript getter-setter

【解决方案1】：

你不能在 Typescript 中这样做，因为 getter 和 setter 应该是相同的类型，所以你可以全部更改为 Partial<IOptions> 或

您的原始需求还有另一种解决方案

将您的选项定义为具有可选属性和默认值的类，如下所示

export class MyComponentOption {
   prop1?: boolean = false;
   prop2?: number = 123;

   constructor(params: MyComponentOption ) {
     Object.assign(this, params)
   }
}

然后

export class MyComponent {
  @Input('config') options : MyComponentOption;
}

这就是你如何使用一些参数来设置它

config:MyComponentOption = new MyComponentOption({prop1:true});

【讨论】：