Angular动态组件ViewChildren始终为undefined
创始人
2024-10-24 15:01:11
0

问题描述: 在Angular中使用ViewChildren获取动态组件时,始终返回undefined。

解决方法:

  1. 确保动态组件已经正确地被添加到父组件中。 例如,在父组件的模板中使用ng-container和ngTemplateOutlet来动态加载组件:

    
    
    

    确保在动态加载组件之前,已经将动态组件添加到dynamicComponent模板中。

  2. 使用AfterViewInit生命周期钩子来获取动态组件。 在父组件中,实现AfterViewInit接口,并在ngAfterViewInit方法中获取动态组件。

    import { Component, ViewChildren, QueryList, AfterViewInit } from '@angular/core';
    import { DynamicComponent } from './dynamic.component';
    
    @Component({
      selector: 'app-parent',
      template: `
        
        
      `
    })
    export class ParentComponent implements AfterViewInit {
      @ViewChildren(DynamicComponent) dynamicComponents: QueryList;
    
      ngAfterViewInit() {
        console.log(this.dynamicComponents); // 获取到动态组件的QueryList
      }
    }
    
  3. 如果动态组件是通过ngIf或ngFor条件渲染的,请确保在获取动态组件之前,动态组件已经被渲染到DOM中。 这可以通过使用setTimeout来延迟获取动态组件,以确保组件已经被渲染到DOM中。

    import { Component, ViewChildren, QueryList, AfterViewInit } from '@angular/core';
    import { DynamicComponent } from './dynamic.component';
    
    @Component({
      selector: 'app-parent',
      template: `
        
    ` }) export class ParentComponent implements AfterViewInit { @ViewChildren(DynamicComponent) dynamicComponents: QueryList; showComponent = true; ngAfterViewInit() { setTimeout(() => { console.log(this.dynamicComponents); // 获取到动态组件的QueryList }); } }

通过以上方法,您应该能够成功获取到动态组件的QueryList,并进行后续的操作。

相关内容

热门资讯

透视插件!wepoker可以设... 透视插件!wepoker可以设置盖牌-关于开挂透视辅助教程(有挂教学)透视插件!wepoker可以设...
最新技巧“浙江游戏大厅修改器”... 最新技巧“浙江游戏大厅修改器”原先有开挂辅助挂(确实有挂);1、这是跨平台的浙江游戏大厅修改器黑科技...
透视挂透视!hhpoker可以... 透视挂透视!hhpoker可以开挂-揭露开挂透视辅助攻略(有挂攻略)1、hhpoker可以开挂系统规...
玩家必看分享“小程序微乐游戏辅... 玩家必看分享“小程序微乐游戏辅助器”其实有开挂辅助器(详细教程);1、让任何用户在无需AI插件第三方...
透视工具!wepoker国外版... 透视工具!wepoker国外版透视-教你开挂透视辅助工具(了解有挂)1、全新机制【wepoker国外...
专业讨论“欢乐游戏城破解版内置... 专业讨论“欢乐游戏城破解版内置修改器”本来有开挂辅助脚本(了解有挂);详细欢乐游戏城破解版内置修改器...
一分钟教你“宝宝游戏辅助”好像... 您好:宝宝游戏辅助这款游戏可以开挂的,确实是有挂的,很多玩家在这款游戏中打牌都会发现很多用户的牌特别...
透视最新!hhpoker透视挂... 透视最新!hhpoker透视挂实战视频-解谜开挂透视辅助攻略(有挂技术)1、超多福利:超高返利,海量...
9分钟了解“四川家园游戏辅助器... 9分钟了解“四川家园游戏辅助器平台交易”果然有开挂辅助下载(有挂规律);亲真的是有正版授权,小编(透...
透视科技!wepoker智能辅... 透视科技!wepoker智能辅助插件-教你开挂透视辅助插件(有挂方针)1、进入到wepoker智能辅...