SAP Spartacus Storefront页面cx-page-layout的赋值逻辑

分别是header，navigation和footer：

其中每个section里包含的slots，定义在文件layout-config.ts里：

运行时打印的输出：

Storefront.component.html的cx-page-layout design time:

运行时的callstack：

这个section有@Input注解：

Decorator that marks a class field as an input property and supplies configuration metadata. The input property is bound to a DOM property in the template. During change detection, Angular automatically updates the data property with the DOM property’s value.

该input property绑定到DOM property，其值来自DOM元素的对应属性。

section$是一个BehaviorSubject，通过next函数将section的值传递给其他subscriber：

更多Jerry的原创文章，尽在：“汪子熙”: