扩展Component实现模板切换

ionic2的模板,默认会被全部打包到www\build\main.js里,导致单文件过大。且无法实现按用户切换不同的模板。
默认Component装饰器写法

@Component(
{
    templateUrl: 'tabs.html'
})

  1. 扩展Component类

    export class BimComponent extends Component
    {

    tempURL?: string;

    }

  2. 写静态方法

    export class Plus {
    public static BimComponent(component: BimComponent): Component

    {
        let tempPath: string = "template/1gs/";
        component.templateUrl = tempPath + component.tempURL;
        return component;
    }

    }

  3. Page里使用装饰器

    @Component(Plus.BimComponent(

    {
        tempURL: 'tabs.html'
    })

    )

  4. 建文件夹结构,放到www目录里

QQ图片20170310173318.png

  1. 改变tempPath的值,界面会随之变换。

    let tempPath: string = "template/main/";

标签: none

评论已关闭