angular - 可以创建抽象属性吗？

Question

我在子类中有一个如下所示的属性:

formModel = {
    motive: 0,
    coop: 0,
    leadership: 0,
    teamwork: 0,
    community: 0,
    professional: 0,
    role_model: 0,
    supportive: 0,
    problem_solving: 0
};

但在其他子类中，这个属性是不同的。

formModel = {
    motive: 0,
    coop: 0,
    leadership: 0,
    teamwork: 0,
    community: 0,
    professional: 0,
    communication: 0,
    respect: 0,
    morale: 0,
    role_model: 0,
    supp_enviro: 0
};

属性的顺序发生变化，名称也发生变化。

我想在其父类中声明此属性的抽象 版本。这可能吗？我在 public abstract formModel: Object; 中没有这样的运气。

编辑:

这是我遇到的错误:

vendor.bundle.js:40839 Uncaught Error: Unexpected value 'undefined' declared by the module 'AppModule'
    at syntaxError (vendor.bundle.js:40839)
    at vendor.bundle.js:54719
    at Array.forEach (<anonymous>)
    at CompileMetadataResolver.webpackJsonp.../../../compiler/@angular/compiler.es5.js.CompileMetadataResolver.getNgModuleMetadata (vendor.bundle.js:54717)
    at JitCompiler.webpackJsonp.../../../compiler/@angular/compiler.es5.js.JitCompiler._loadModules (vendor.bundle.js:66103)
    at JitCompiler.webpackJsonp.../../../compiler/@angular/compiler.es5.js.JitCompiler._compileModuleAndComponents (vendor.bundle.js:66076)
    at JitCompiler.webpackJsonp.../../../compiler/@angular/compiler.es5.js.JitCompiler.compileModuleAsync (vendor.bundle.js:66005)
    at PlatformRef_.webpackJsonp.../../../core/@angular/core.es5.js.PlatformRef_._bootstrapModuleWithZone (vendor.bundle.js:71695)
    at PlatformRef_.webpackJsonp.../../../core/@angular/core.es5.js.PlatformRef_.bootstrapModule (vendor.bundle.js:71681)
    at Object.../../../../../src/main.ts (main.bundle.js:1339)

我注意到如果我将以下方法添加到我的父类而不是子类，我只会得到这个错误:

public handleRadioButtonChanges(event: Event): void {
    console.log("test");
}

Answer 1

问题的答案是是，您可以创建抽象属性。我可以毫无错误地执行以下操作:

// what are the restrictions on FormModel? 
// See [@amal's answer](https://stackoverflow.com/a/46328720/2887218) 
// for discussion about this
interface FormModel {
  [key: string]: number;
}

abstract class Parent {
  public abstract formModel: FormModel;  
  public handleRadioButtonChanges(event: Event): void {
    console.log("test");
}
}

class Child extends Parent {
  formModel = {
    motive: 0,
    coop: 0,
    leadership: 0,
    teamwork: 0,
    community: 0,
    professional: 0,
    role_model: 0,
    supportive: 0,
    problem_solving: 0
  };
}

class AnotherChild extends Parent {
  formModel = {
    motive: 0,
    coop: 0,
    leadership: 0,
    teamwork: 0,
    community: 0,
    professional: 0,
    communication: 0,
    respect: 0,
    morale: 0,
    role_model: 0,
    supp_enviro: 0
  };
}

---

但是，您遇到的错误似乎是 webpack 特有的，我不知道是什么原因造成的。当我使用 tsc 编译时，使用或不使用 public abstract formModel: FormModel; 行生成的 JavaScript 没有区别。它只是类型信息，它往往不会进入 JavaScript。您可能需要提供有关您的环境的更多信息，以便其他人可以复制。

在任何情况下，您遇到的问题可能与抽象属性本身关系不大，只是在将该属性添加到父类时暴露了它。也许this GitHub issue相关吗？或者 this SO question ？我真的不知道，因为我没有任何 webpack 专业知识。