是否可以在Angular 2中扩展模板？

Question

我想知道是否有可能采用一个组件模板中已经存在的html（和指令）并将它们以某种方式包含在另一组件模板中。如果要扩展现有组件并希望使用其现有模板但添加一些其他html /指令，这将很有用。

例如，在Twig（一个流行的php模板库）中，可以扩展模板：

{% extends "base.html" %}

{% block title %}Index{% endblock %}
{% block head %}
    {{ parent() }}
    <style type="text/css">
        .important { color: #336699; }
    </style>
{% endblock %}
{% block content %}
    <h1>Index</h1>
    <p class="important">
        Welcome on my awesome homepage.
    </p>
{% endblock %}

Angular 2中有这样的事情吗？同样，我不是要嵌入现有组件，而是扩展一个组件。

Answer 1

如果模板标签中有大量的html，则可以使用ngTemplateOutlet而无需创建新组件：

https://angular.io/api/common/NgTemplateOutlet

您可能会想出一种新颖的方式来共享模板，以便它们可以被多个组件使用。

例如，父母可以TemplateRef使用来获取ViewChild，然后将其传递Input给子组件的属性。

您可以在此处找到有关这些技术的更多信息：

http://blog.angular-university.io/angular-ng-template-ng-container-ngtemplateoutlet/