angular - 为什么 Ant Design for Angular 有网格指令而不仅仅是组件

Question

 <div nz-row nzType="flex" nzJustify="center" nzAlign="top">
    <div nz-col nzSpan="4"><p class="height-100">col-4</p></div>
    <div nz-col nzSpan="4"><p class="height-50">col-4</p></div>
    <div nz-col nzSpan="4"><p class="height-120">col-4</p></div>
    <div nz-col nzSpan="4"><p class="height-80">col-4</p></div>
  </div>

Ant 设计组件库中的这段代码使用nz-colas 指令。有人可以解释为什么它被用作指令而不是组件吗？使用 as 指令有什么意义吗？

Answer 1

如果您查看 的源代码NzColDirective，它extends就是NzColComponent类。

NzColComponent本质上要访问诸如@Host组件、@Host指令ElementRef等之类的东西，依赖NzColDirective并最终从那里获取它，因为NzColDirective本质上是调用super它的构造函数并将所有这些属性传递给它。