Question

我是跨平台和离子框架的新手。

我们有几个零售商，他们的HTML页面和设计可能与他们的要求不同，但大多数后端功能都是相同的。

例如，零售商1的登录页面不同，但所有零售商的登录逻辑都相同。

我的项目结构看起来像

    Project Name
       .src
        .. app
        .. assert
        .. pages
              ... Login
                   .... retailer1Login.html
                   .... retailer2Login.html
                   .... Login.scss
                   .... Login.ts

Login.ts类应该路由到HTML文件取决于配置文件

@Component({
  selector: 'page-login',
  templateUrl: {{this.htmlPage}},
})

export class SembCorpLoginPage {
  htmlPage : any;


  constructor(public navCtrl: NavController, public navParams: NavParams) {

  }




     ngOnInit() {
        console.log("App.Components")
        if(CONFIG.retailerName == CONSTANTS.retailer1){
          this.htmlPage = retailer1LoginPage;
          console.log("Apps if pageLoader");
        }else {
          this.htmlPage = retailer2LoginPage;
          console.log("Apps else");
        }
        console.log(this.htmlPage);
      }

      ionViewDidLoad() {
        console.log('ionViewDidLoad LoginPage');
      }

为了维护单个代码库系统，我们有一个配置文件，但配置参数与零售商不同。

读取Login.ts中的配置文件，并依赖于html文件加载html文件。

是否可以这样做。我收到了错误。我无法继续前进。

任何帮助或指南？

Answer 1

最佳做法是使用Dynamic Component Loader。

您还可以查看sample implementation

加载动态html - 从配置读取并加载html Ionic 2 Angular 2

1 个答案: