Angular實(shí)現(xiàn)靈活的動(dòng)態(tài)創(chuàng)建組件指令

在某些場(chǎng)景下需要?jiǎng)討B(tài)創(chuàng)建指令，但是不想每次都要寫很多重復(fù)的代碼，那么封裝一個(gè)靈活的指令是比較好的方式。

本文代碼庫已經(jīng)在github上

ngx-dyncmp

stackblitz示例連接

最終目標(biāo)

設(shè)計(jì)之前需要設(shè)想需要做成什么樣子，支持哪些特性，下面是基本的特性：

• 支持Input裝飾器屬性綁定，用于父組件向子組件傳遞值。
• 支持Output裝飾器屬性綁定，用于父組件感知子組件的變化。
• 支持各種組件類型的動(dòng)態(tài)創(chuàng)建

最終使用形式如：

<ng-container [ngxDyncCmp]="component"

總結(jié)

以上是生活随笔為你收集整理的Angular实现灵活的动态创建组件指令的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。