頁面工具

Import 相依

import { UofxPluginPage } from '@uofx/plugin';   

使用方式

頁面類別繼承底層類型UofxPluginPage即有對應的變數可用。

import { UofxPluginPage } from '@uofx/plugin'
@Component({
  ...
})
export class SettingPage extends UofxPluginPage implements OnInit {
  ...
} 

取得 Entry Host

取得 Entry Host 設定為 API Service 的 Server Url。

import { UofxPluginPage } from '@uofx/plugin'
@Component({
  selector: 'uofx-web-setting',
  template: `...`
})
export class SettingPage extends UofxPluginPage implements OnInit {
  constructor(private apiService: APIService) { super(); }

  ngOnInit() {
    console.log(this.pluginSetting.entryHost);
    this.apiService.serverUrl = this.entryHost;
  }
}

取得路徑

透過取得的路徑可在routerLink上組合使用，使用此方法方便直接指定對應的路徑，不必擔心相對路徑問題。

import { UofxPluginPage } from '@uofx/plugin'
@Component({
  selector: 'uofx-web-setting',
  template: `
    <uofx-breadcrumb [items]="breadCrumbItems"> </uofx-breadcrumb>
  `
})
export class SettingPage extends UofxPluginPage implements OnInit {
    /** 麵包屑清單 */
  breadCrumbItems: Array<MenuItem> = [
    { label: '大廳', routerLink: [this.baseUrl.admin] },
    { label: '內容置中' },
  ];

  ngOnInit() {
    console.log(this.baseUrl.adminPlugin);
    // 輸出: /admin/plugin/edesampleplugin
  }
}

Base URl 可用屬性

名稱	說明	目標位置
admin	管理者大廳	/admin
adminPlugin	管理者目標外掛模組根路徑	/admin/plugin/{codePath}
user	使用者大廳	/user
userPlugin	使用者目標外掛模組根路徑	/user/plugin/{codePath}
appPlugin	App目標外掛模組根路徑	/home/plugin/{codePath}