可以從 SAP 電商雲 Spartacus UI 的實現中找到一個例子。

```typescript
    return this.resolveModuleFactory(moduleFunc).pipe(
      map(([moduleFactory]) => moduleFactory.create(parentInjector)),
      concatMap((moduleRef) => this.runModuleInitializersForModule(moduleRef)),
      tap((moduleRef) =>
        this.events.dispatch(
          createFrom(ModuleInitializedEvent, {
            feature,
            moduleRef,
          })
        )
      )
    );
  }

```

下圖這段程式碼，createFrom 方法的輸入引數 ModuleInitializedEvent，是我們在另一個 TypeScript 檔案裡定義的一個 class，而 feature 和 moduleRef，是例項資料：

![](https://img-blog.csdnimg.cn/img_convert/cb47021ba390a804339e644b6ff8c2e8.png)

createFrom 的實現：

![](https://img-blog.csdnimg.cn/img_convert/d658fb3d66aad555fb324bf1af5640ab.png)

```typescript
/**
 * Creates an instance of the given class and fills its properties with the given data.
 *
 * @param type reference to the class
 * @param data object with properties to be copied to the class
 */
export function createFrom<t>(type: Type<t>, data: T): T {
  console.log('Jerry dynamically created new instance for type: ', type , ' with data: ' , data);
  return Object.assign(new type(), data);
}
```

這裡傳入的 class 定義，和傳入的例項資料，必須嚴格匹配：

![](https://img-blog.csdnimg.cn/img_convert/276551ccd6b1b88d5ab1888f2cfc30e5.png)

例如 ModuleInitializedEvent 的欄位 feature 和 moduleRef，在我們傳入 createFrom 函式的例項資料裡是一一對應的。</t></t>

Angular 如何根據一個 class 的定義和資料，動態建立一個該類的例項

相關文章