从 angularjs 升级到 angular 时替换 ng-include 的最佳实践？

Question

令我沮丧的是，angular 不再支持 ng-include 指令。我的代码库使用了数百个共享的部分 html 文件。我似乎找不到任何文档。任何人都可以指出正确的方向。最好的做法是对每个 html 文件进行组件化吗？

Answer 1

您可以通过传递TemplateRef 来使用ngTemplateOutlet 指令来替代ng-include 的角度。这里我提到了一个示例代码。

@Component({
  selector: 'child',
  template: `
    <div>
      child template which includes myTemplate
      <ng-container [ngTemplateOutlet]="myTemplate"></ng-container>
    </div>`
})
export class ChildComponent {
  @Input() myTemplate: TemplateRef<any>;
}


@Component({
  selector: 'app-root',
  template: `
    <p>Parent</p>
    <child [myTemplate]="myTemplate"></child>
    <ng-template #myTemplate>hi julia template!</ng-template>
  `
})
export class AppComponent {
  @ViewChild('myTemplate', {read: TemplateRef}) myTemplate: TemplateRef<any>;
}