Ionic2:无效的页面组件:ProjectInfopage

Question

export class ProjectDetail {
    page: string;
}

JSON中包含的页面信息，例如：

{
    "data":[
         {
             page: "PageInfoPage"
         },
         {
             page: "PageInfoPage1"
         }         
    ]
}

i从此JSON中解析信息，然后保存在数组中。执行this.nav.push(pd.page)时，请按照描述的标题进行异常。我不知道如何将"字符串"转换为"组件"。

=========================================================================我将诸如Angular 2 -Resolve组件工厂之类的方法与描述的字符串一起使用。这是我的代码：

itemClick(pd: ProjectDetail) {
        var factories = Array.from(this.resolver['_factories'].keys());
        var factoryClass = <Type<any>>factories.find((x: any) => x.name === pd.page);
        const factory = this.resolver.resolveComponentFactory(factoryClass);
        const compRef = this.vcRef.createComponent(factory);
        if (this.componentRef) {
            this.componentRef.destroy();
        }
        this.componentRef = compRef;
        this.nav.push(compRef, {
            item: pd,
            pid: this.project.pid
        });
    }

它仍然不起作用。谢谢您的答案。

最后，我用愚蠢的方法解决了它。当我创建这样的地图时：

componentRegistry = {
        'ProjectInfoPage': ProjectInfoPage
    };

然后以这样的推动：

this.nav.push(this.componentRegistry[pd.page], {
            item: pd,
            pid: this.project.pid
        });

Answer 1

通常，您必须为要导航的页面导入实际的组件类，然后将该类推到堆栈上。默认情况下，Ionic2中没有任何办法可以通过字符串引用导航。今天我遇到了同样的问题，我希望能够使用字符串导航，而不是在堆栈上推动组件类。

查看有关如何实现这一目标的离子论坛中的以下链接。查看对线程的最后两个响应，其中包括如何从beta阶段解决此问题，然后使用Ionic 2.2.0进行更新的答案。尽管我很确定自最终版本以来的所有版本的Ionic 2版本都可以使用相同的解决方案。

https://forum.ionicframework.com/t/ionic2-navigation-circular-depencies/41123/5