单击事件后 ElementRef 更改答案

【问题标题】：ElementRef changed after click event单击事件后 ElementRef 更改
【发布时间】：2016-04-15 13:15:52
【问题描述】：

我的情况如下：我有 3 个组件：MainComponent、ComponentA、ComponentB

MainComponent 是动态加载的 ComponentA。 ComponentA 有一个 onClick 调用 MainComponent.addComponent(ComponentB) 的按钮

export class MainLayout
  {
    constructor(private dcl: DynamicComponentLoader,private elementRef:ElementRef) {
    ///this will work fine
    this.dcl.loadIntoLocation(ComponentA,elementRef);
    }


    addComponent(component:Type) {
     ///this will fail 
      this.dcl.loadIntoLocation(component, this.elememtRef,'child1');
    }
}

我得到的错误：您可以看到错误来自 elementRef 对象....

未捕获的异常：评估“点击”时出错原始异常：TypeError：无法读取未定义的属性“_view” 原始堆栈跟踪： TypeError：无法读取未定义的属性“_view” 在 Object.internalView (http://localhost:63342/decisionApp/decision-modeling-ui/node_modules/angular2/bundles/angular2.dev.js:6236:19) 在 AppViewManager_.getNamedElementInComponentView (http://localhost:63342/decisionApp/decision-modeling-ui/node_modules/angular2/bundles/angular2.dev.js:11240:33) 在 DynamicComponentLoader_.loadIntoLocation (http://localhost:63342/decisionApp/decision-modeling-ui/node_modules/angular2/bundles/angular2.dev.js:14547:62) 在 MainLayout.resolveComponent (http://localhost:63342/decisionApp/decision-modeling-ui/app/playground/ui-composition/mainLayout.js:32:18) 在 ComponentsList.onClick (http://localhost:63342/decisionApp/decision-modeling-ui/app/playground/ui-composition/ComponentsList.js:25:20)

【问题讨论】：

为什么要使用全局变量？您是否路由并返回到中间的组件？
我把我的问题改得更清楚了...
你看到你有错字吗？ this.elememtRef != this.elementRef

标签： angular

【解决方案1】：

您的描述不是很清楚，因为您没有告诉我们失败消息和有关您的组件的其他一些事情。所以我只能猜测：

组件的某些东西，this.elememtRef,'child1' 在您调用 addComponent 时不存在，所以它会失败？也许 ComponentA 尚未完全加载？我还假设“组件”是指 ComponentB ？

【讨论】：

【解决方案2】：

好吧，我想通了，我有不同 objectRefs 的原因是我在 ComponenetA 配置中设置了 providers:[MainComponent] 。这为我创建了 MainComponent 的一个新实例。因此在构造函数中注入了一个新的 ElementRef 实例。

【讨论】：