Angular2：只使用较大HTML文件中的一块代码

对于我在Angular2中的项目，我试图从一个更大的HTML文件中检索一个特定的代码块。根据所走的路线，它应该显示一个紧凑的或详细的视图

我认为最好的做法是为每个可能的视图制作不同的模块，但是这种方式会有太多的模块。是否可以使用*ngIf检查要显示或隐藏的内容？或者还有其他解决方案吗

视觉表现

---

在回答这个问题之前，我不知道@Input（）和@Output（），将它们与*ngIf=”“结合使用，我已经能够解决这个问题

家长： task-detail.component.ts

task-detail.component.html

customerview.component.html

...
这里有详细信息

资料来源：

---

编辑：我不确定，但可能您不需要在父级中定义布尔值（使task-detail.component.ts中的代码不起任何作用）

在此之前，我不知道@Input（）和@Output（），将它们与*ngIf=”“结合使用，我已经能够解决这个问题

家长： task-detail.component.ts

task-detail.component.html

customerview.component.html

...
这里有详细信息

资料来源：

---

编辑：我不确定，但可能不需要在父级中定义布尔值（使task-detail.component.ts中的代码不起任何作用）

您完全可以使用

*ngIf

您完全可以使用

*ngIf

...
export class TaskDetailComponent implements OnInit {
   extendedCustomer: boolean;
}

...
<app-customerview [extendedCustomer]="false"></app-customerview>
...

import { Component, OnInit, Input } from '@angular/core';
...
export class CustomerViewComponent implements OnInit {
   @Input() extendedCustomer: boolean;
}

<!-- Simple-->
...
<!-- Extended-->
<div *ngIf="extendedCustomer">
   <p>detailed information here</p>
</div>