javascript - 启动 angular2 应用程序、html 或 .ts 文件时首先渲染什么？

Question

谁能解释一下当我们打开 Angular 内置的单页应用程序的 URL 时会发生什么？

是先执行初始app.component.ts(构造函数和ngOnInit)，然后app.component.html渲染，还是相反。另外，如果我定义了一些 @Inputs() 并且输入为 .ts 文件提供了 app.component.html 文件中的一些数据，那么在 app.component.ts 必须等待输入属性的情况下会发生什么值(value)观？

任何人都可以提供一个好的链接或用几行解释这个过程(不要太深入)

Answer 1

简而言之，每个组件都有模板 (HTML)、样式 (CSS) 和主体(TypeScript 类)。 Typescript 类是实际的组件。

@Component({
  template: `
    <div>
      <h4>{{data.headline}}</h4> 
      {{data.body}}
    </div>
  `
})
export class MyComponent{
  @Input() data: any;

}

如果您愿意，您可以在单独的文件中指定模板(当您有多于几行 HTML 时才有意义) - 这不会改变任何内容。

首先，组件被实例化为类。然后组件生命周期开始 - 您可以在 official documentation 中阅读更多相关信息。 .

该类呈现模板，在生命周期文档中，您可以看到 View 是在运行某些 Hook 后创建的 - 让您有机会获取 @Input 并进行其他设置为 View 添加数据。