跳到主要內容區塊

:::

cms-web-03尚未創建或關聯現有的模組

由於目前的cms模組與cms detail模組兩個綁在一起,所以編碼並不是一對一,以下由cms- 當作實際欲導向之Module。

  • 如果該Cms模組為全新模組,則請參閱「全新Cms模組建置」
  • 如果是既有模組,則請參閱「舊有Cms模組建置」
  • 如果只是要增加此編碼至已實現的模組,請參閱「舊有Cms模組建置」的「編輯cms-generator.module.ts」步驟

全新Cms模組建置建置

  1. 於cms-generator下指令建置
      1. mkdir cms-example
      2. cd cms-example
      3. ng g class cms-example
      4. ng g class abstract-cms-example
  2. 編輯cms-example.ts,此檔案為此模組資料結構
  3. 編輯abstract-cms-example.ts,此為此模組共用變數與方法
    1. 在class前加上abstract修飾字
    2. 如果是單筆資料則繼承AbstractCms<CmsExample>,如果是多筆資料則繼承AbstractCmsList<CmsExample>
    3. 設定limit$的值,此為此Cms模組可抓取的後端資料數量
    4. 設定offset$的值,此為此Cms模組抓取的後端資料位移量
    5. 設定moduleKey的值,此為此Cms模組所對應之後端模組
    6. 設定data的值,此為此Cms模組資料
    7. 實作或覆寫其他Cms模組共用變數與方法
  4. 接續舊有Cms模組建置

舊有Cms模組建置

  1. 於cms-generator/cms-example下指令建置
    1. ng g m cms-example-01
    2. cd cms-example-01
    3. ng g c index
  2. 編輯cms-example-01.module.ts
    1. 於NgModule加入:entryComponents: [IndexComponent]
    2. 於Module Class加入:static entry = IndexComponent;
  3. 編輯cms-widgets.ts
    1. 增加route至cmsWidgets裡面:{path: 'cms-web-03', loadChildren: () => import('./cms-example/cms-example-01/cms-example-01.module).then(mod => mod.CmsExample01Module)'}
  4. 編輯IndexComponent
    1. 繼承AbstractCmsExample
  5. 套版
    1. 將主要css放置IndexComponent旁並引入
    2. 圖片放置/assets/images底下
回到最上方

本網站使用Cookies收集資料用於量化統計與分析,以進行服務品質之改善。請點選"接受",若未做任何選擇,或將本視窗關閉,本站預設選擇拒絕。進一步Cookies資料之處理,請參閱本站之隱私權宣告