angular - 为什么 Angular 组件需要引导?
问题描述
因此,我创建了一个包含两个组件的简单 Angular 应用程序(我只展示了相关的代码片段):
@NgModule({
declarations: [
AppComponent,
Block2Component
],
imports: [ BrowserModule ],
providers: [],
bootstrap: [ AppComponent, Block2Component ]
})
export class AppModule { }
我的登录页面想要呈现 2 个顶级组件:
<body style="background-color: rgb(234, 240, 220);">
<p>Content that came from index.HTML</p>
<app-root></app-root>
<app-block2></app-block2>
</body>
在这种代码状态下,它可以很好地构建和呈现页面。但是组件引导的含义是什么?我尝试从模块的引导部分中删除组件名称,并且该组件从页面中消失了。好吧,某些事情需要引导。但为了什么?
根模块从main.ts
文件中引导。这意味着 Angular 知道可用组件的列表。为什么它不能在登录页面模板上看到组件的选择器后在后台进行引导?
解决方案
自举数组
应用程序通过引导根 AppModule(也称为 entryComponent)来启动。除此之外,引导过程创建引导数组中列出的组件,并将每个组件插入浏览器 DOM。
每个引导组件都是其自己的组件树的基础。插入自举组件通常会触发一系列组件创建来填充该树。
虽然您可以在主机网页上放置多个组件树,但大多数应用程序只有一个组件树并引导单个根组件。
这个根组件通常称为 AppComponent 并且位于根模块的引导程序数组中。
推荐阅读
- git - GIT - 从上次拉取提交消息和差异
- python - PPTX 是否已更新为包含辅助轴?
- c# - Entity Framework 6 中一对多依赖的更新问题
- python - 如何在 JSON 文件中插入空间参考以在服务器上添加功能
- python - 如何在 QtPy 中设置日志记录级别(启用完整的调试信息)
- sharepoint-2013 - 托管元数据服务或连接当前不可用”
- isabelle - 在 Isabelle 证明中合并 2 个具有共同未知变量的子目标
- spring-boot - spring boot 安全数据库授权,无需密码编码
- utf-8 - VBS 打开 txt - 使用 UTF-8 编码保存
- python - 将数据帧拆分为 X 行数的组并限制组中的类型数