<kbd id="afajh"><form id="afajh"></form></kbd>
<strong id="afajh"><dl id="afajh"></dl></strong>
    <del id="afajh"><form id="afajh"></form></del>
        1. <th id="afajh"><progress id="afajh"></progress></th>
          <b id="afajh"><abbr id="afajh"></abbr></b>
          <th id="afajh"><progress id="afajh"></progress></th>

          自習(xí)室.28 | Angular 特性模塊 - 對組件進行分類

          共 715字,需瀏覽 2分鐘

           ·

          2021-03-28 02:31

          隨著 Angular 應(yīng)用的擴大,僅靠根模塊 ngModule 無法清晰的組織各種組件,為此,需要一個特性模塊來對代碼進行組織歸類。

          例如 showcase 這個組件有幾種版本 showcase-v1, showcase-v2,那么我們就可以使用 showcase.module.ts 這樣的模塊來組織這些組件,然后再由 showcase 模塊導(dǎo)入到上一級或者頂級模塊中。

          創(chuàng)建 showcase 特性模塊

          ng g module showcase

          CLI?會創(chuàng)建一個?showcase?文件夾,其中有模塊文件:showcase.module.ts

          519f55b036814d108f9b57cc4661300e.webp

          CommonModule?默認(rèn)都會導(dǎo)入,因為組件一般都可能會用到?ngIf?和?ngFor?這樣的指令

          創(chuàng)建 showcase-v1, showcase-v2 組件

          ng g component showcase/showcase-v1ng g component showcase/showcase-v2

          這時你已經(jīng)發(fā)現(xiàn)?CLI?已經(jīng)自動幫你把組件導(dǎo)入到了?showcase?模塊中:

          4c58eab068a52fed77549008b00f7fd8.webp

          把?showcase?特性模塊導(dǎo)入到上一級(或者根模塊)

          這里我們并沒有劃分得很深,所以直接把?showcase?模塊導(dǎo)入到根模塊

          edc0abb919e70708d7d9bd5666801717.webp

          現(xiàn)在頁面應(yīng)該是報錯的,因為 showcase 模塊的 ngModule 并沒有暴露出組件,這里就是非常需要注意的地方:showcase 模塊(特性模塊)除了導(dǎo)入相關(guān)的組件,也要導(dǎo)出他們:

          90adba860ab20468b63eff3cb636bc56.webp

          構(gòu)建一個很大的框架有很多組件的時候,對組件進行分類就非常有必要,需要用到的時候就導(dǎo)入到其他的模塊中使用。

          1342e085e5a41079a01535ec27b0499b.webp






          掃碼二維碼申請入群內(nèi)推南寧IT職位助力于行業(yè)交流




          瀏覽 66
          點贊
          評論
          收藏
          分享

          手機掃一掃分享

          分享
          舉報
          評論
          圖片
          表情
          推薦
          點贊
          評論
          收藏
          分享

          手機掃一掃分享

          分享
          舉報
          <kbd id="afajh"><form id="afajh"></form></kbd>
          <strong id="afajh"><dl id="afajh"></dl></strong>
            <del id="afajh"><form id="afajh"></form></del>
                1. <th id="afajh"><progress id="afajh"></progress></th>
                  <b id="afajh"><abbr id="afajh"></abbr></b>
                  <th id="afajh"><progress id="afajh"></progress></th>
                  波多野结衣乱码无码视频 | 麻豆免费成人视频 | 免费伊人网| 网络色色大香蕉 | 在线观看免费黄色小视频 |