【问题标题】:How to create dynamic component in Angular 2 with Dart?如何使用 Dart 在 Angular 2 中创建动态组件?
【发布时间】:2016-06-16 07:09:10
【问题描述】:

我想动态切换哪个 templateUrl 用于 Angular 2 / Dart 组件。

我发现要走的路是动态创建一个新组件来放置 templateUrl。有几个关于如何使用带有 TypeScript 的 Angular 2 ComponentResolver 实现此目的的示例,for example this one,但我一直未能将它们翻译成 Dart。

基本上我没有做的是从函数中传递一个新组件:

createComponentFactory(ComponentResolver resolver,
        ComponentMetadata metadata) {
    final cmpClass = class DynamicComponent {};
    final decoratedCmp = Component(metadata)(cmpClass);
    return resolver.resolveComponent(decoratedCmp);
}

这种方法和其他类似 Dart 方法的问题在于,我无法将 class DynamicComponent {}; 设置为变量或从函数返回它而不会出现如下构建错误:

[DirectiveProcessor]:
  Failed with 5 errors
Error 1: line 37, column 22 of lib/projects/project_component.dart and parts: Expected an identifier
    final cmpClass = class DynamicComponent {};
                     ^^^^^
Error 2: line 37, column 22 of lib/projects/project_component.dart and parts: Expected to find ';'
    final cmpClass = class DynamicComponent {};
                     ^^^^^
Error 3: line 37, column 22 of lib/projects/project_component.dart and parts: Expected a statement
    final cmpClass = class DynamicComponent {};
                     ^^^^^
Error 4: line 37, column 22 of lib/projects/project_component.dart and parts: Unexpected token 'class'
    final cmpClass = class DynamicComponent {};
                     ^^^^^
Error 5: line 37, column 28 of lib/projects/project_component.dart and parts: Expected to find ';'
    final cmpClass = class DynamicComponent {};
                           ^^^^^^^^^^^^^^^^

创建这样的新组件是我在遵循我所见过的创建动态组件的任何示例时常见的绊脚石。有谁知道如何使用 Dart 实现这一目标?

【问题讨论】:

    标签: javascript angularjs angular dart


    【解决方案1】:

    你不能在 Dart 中内联声明类。

    这应该做你想做的事

    class DynamicComponent {}
    
    createComponentFactory(ComponentResolver resolver,
            ComponentMetadata metadata) {
        final cmpClass = DynamicComponent;
        final decoratedCmp = Component(metadata)(cmpClass);
        return resolver.resolveComponent(decoratedCmp);
    }
    

    如果你能让它工作,我会很高兴看到完整的解决方案。

    【讨论】:

    • 非常感谢!这解决了我在类声明中遇到的问题。我仍在研究整个解决方案,一旦我有一些可以正常工作的东西,我会在这里发布最终版本。
    猜你喜欢
    • 2017-09-10
    • 2017-07-07
    • 2017-09-25
    • 2017-03-13
    • 1970-01-01
    • 2016-09-26
    • 2017-12-13
    • 2022-01-20
    • 2017-05-24
    相关资源
    最近更新 更多