Question

好的，所以我不是在寻找更多帮助我的方法，我主要是一个java开发人员，所以如果需要，请原谅（并更正）术语。这也是为什么我需要帮助的原因，因为我仍然处于角色之旅的早期阶段。

所以我使用角度5，以及ui-router。我正在尝试设计一个三个标签页[view，html，css]，其中html和css将是用户将输入所述内容的文本区域，然后，视图将是该呈现。将有数据（可以在呈现视图之前或在呈现视图时获取）将绑定到该html。用户基本上会放入角度模板。

我一直在阅读this example，但不确定这是否是正确的做法。

Answer 1

这篇文章有解决方案 https://blog.angularindepth.com/here-is-what-you-need-to-know-about-dynamic-components-in-angular-ac1e96167f9e

基本上看起来像这样

@ViewChild("ancc", { read: ViewContainerRef }) container;

@Input() property:Property = new Property();

constructor(private  resolver: ComponentFactoryResolver,private _compiler: Compiler){
    console.log("hit layout constructor");
}
view(){

    // create the template
    const template = '<span>generated on the fly: {{property.label}}</span>';
    //clear out the old instance
    this.container.clear();

    const tmpCmp = Component({template: template})(class {
    });
    const tmpModule = NgModule({declarations: [tmpCmp]})(class {
    });

    this._compiler.compileModuleAndAllComponentsAsync(tmpModule)
        .then((factories) => {
            const f = factories.componentFactories[0];
            //attach the component to the view
            const cmpRef = this.container.createComponent(f);
            //bind the data
            cmpRef.instance.property = this.property;
        })
}

希望这有助于某人！

使用ui路由器将动态html转换为视图

1 个答案: