Angular 根据输入参数类型在模板中显示div

Angular 根据输入参数类型在模板中显示div,angular,typescript,Angular,Typescript,我的情况如下:我有一个类层次结构: 在Angular应用程序中,我有一个组件,它有一个进程作为输入: @Input() currentProcess: Process 根据这个过程的具体类型(ProjectProcess或EmployeeProcess),我想在模板中显示另一个div。 当然,我可以通过使用instanceof检查变量并设置boolen变量,然后在模板中使用*ngIf检查它来做到这一点,但我对此感到不舒服。这真的是唯一的方法还是有更好的解决方案 谢谢你的努力 保持干

我的情况如下:我有一个类层次结构:

在Angular应用程序中,我有一个组件,它有一个进程作为输入:

    @Input() currentProcess: Process 
根据这个过程的具体类型(ProjectProcess或EmployeeProcess),我想在模板中显示另一个div。 当然,我可以通过使用instanceof检查变量并设置boolen变量,然后在模板中使用*ngIf检查它来做到这一点,但我对此感到不舒服。这真的是唯一的方法还是有更好的解决方案


谢谢你的努力

保持干净,使用吸气剂:

get isProjectProcess() { return this.currentProcess instanceof ProjectProcess; }
get isEmployeeProcess() { return this.currentProcess instanceof EmployeeProcess; }

此解决方案的优点是,您的布尔值在每个生命周期中都会发生更改,从而避免了实现
一次更改

要使其干净,请使用getter:

get isProjectProcess() { return this.currentProcess instanceof ProjectProcess; }
get isEmployeeProcess() { return this.currentProcess instanceof EmployeeProcess; }

此解决方案的优点是,您的布尔值在每个生命周期中都会发生变化,从而避免了实现
onChanges

我100%同意。使用Angular LifeCycle函数处理此问题,并在组件控制器中执行逻辑。这使得它更易于测试和可靠。并使模板更具可读性。很多人我100%同意。使用Angular LifeCycle函数处理此问题,并在组件控制器中执行逻辑。这使得它更易于测试和可靠。并使模板更具可读性。有很多……可以