javascript - Angular 2 和组件树

Question

我正在研究 Angular 2 内部组件和行为，并且对组件树管理有一些疑问。

在基于组件的 Web 应用程序中，很明显我们有一个组件树。一个组件由另一个组件组成，从上到下，非常强大。

但是现在，我想知道 Angular 2 如何在内部管理这个组件树的表示？

<小时/>

我的意思是，我们从来没有在 Angular 组件中说过，组件将位于其内部，除了在模板中。

<小时/>

例如，我从未在我的 HomeComponent 定义中说它拥有 PrestaCardComponent :

import { Component, OnInit, Inject } from '@angular/core';

@Component({
    selector: 'app-home',
    templateUrl: './home.component.html',
    styleUrls: ['./home.component.css']
})
export class HomeComponent implements OnInit {

    prestations: Array<any>;
    featurettes: Array<any>;
    constructor( @Inject('AppStore') private appStore: any) {
        this.prestations = [];
        this.featurettes = [];
    }

    ngOnInit() {

    }

}

除了我的模板:

<div *ngFor="let prestation of prestations" class="col-md-4 m-b">
                <app-presta-card [title]="prestation.title" [content]="prestation.content" [image]="prestation.image"></app-presta-card>
            </div>

我理解的意思

这意味着 Angular 2 能够通过读取不同的模板来创建虚拟组件树。

这怎么可能？它是如何工作的？

Answer 1

使用占卜。您将获得清晰的洞察。