angular - 如何在 Angular 中定义组件类型？

Question

如何在虚拟函数中定义 Component 的类型？

@Component({
   templateUrl: 'a'
})
export class MyApp {
}
function dummy(component: any) {
     ....
}       
dummay(MyApp);

Answer 1

您的问题中有几个不同的项目需要澄清。

在您的示例中，export class MyApp {...} 正在创建类型为 MyApp 的类。

通常，您会将类的实例传递给函数。如果这就是您要尝试执行的操作，那么它将如下所示:

function dummy(component: MyApp) {
     ....
}       
dummay(new MyApp());

如果您实际上是想将类类型传递给函数，那么您需要执行以下操作:

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

function dummy(component: Type<any>) {
     ....
}       
dummay(MyApp);

另一种可以使它更强大的方法是，如果您将可以传递给函数的组件限制为仅实现给定接口(interface)的组件。这方面的一个例子如下:

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

export interface IFoo {
   id: number;
   getStuff: () => string;
}
@Component({
   templateUrl: 'a'
})
export class MyApp implements IFoo {
}
function dummy(component: Type<IFoo>) {
     const stuff = component.getStuff();
     ....
}    

dummay(MyApp);