Question

如何从角度4中的父组件继承模板？大多数材料例如覆盖父组件，如下所示：

import { Component } from '@angular/core';
import { EmployeeComponent } from './employee.component';

@Component({
  selector: 'app-employee-list',
  template: `
    <h1>{{heading}}</h1>
    <ul>
      <li *ngFor="let employee of employees">
        {{employee.firstName}} {{employee.lastName}} <br>
        {{employee.email}} <br>
        <button (click)="selectEmployee(employee)">Select</button>
      </li>
    </ul>
  `
})
export class EmployeeListComponent extends EmployeeComponent {
  heading = 'Employee List';
}

但是我想从EmployeeComponent继承模板，而不是用我自己的自定义版本覆盖它。怎么能实现这一目标？

Answer 1

由于您有子组件，您可以将其放在父目录中，并为其指定一个引用父组件的URL。

@Component({
  selector: 'app-child',
  templateUrl: '../parent.component.html',
  styleUrls: ['../parent.component.scss']
})

Answer 2

如果您想向父模板添加一些内容，只需添加它即可

@Component({
  selector: 'child',
  template: require('/path/to/child-template.html') + require('/path/to/parent-template.html')
})

（正在使用webpack）

如何从角度4中的父组件继承模板？

2 个答案: