为了账号安全,请及时绑定邮箱和手机立即绑定

Angular中ViewChild\ngAfterViewInit\Promise的使用,在父组件初始化时等待子组件的返回值

标签:
AngularJS

1、子component中的异步方法

initCreateJob = () =>
    new Promise((resolve, reject) => {
        setTimeout(() => {
          this.spiderFormService.saveUserJob(this.spiderJobInfo).subscribe((res: Res) => {
            if (res.code === 1) {
              // val = res.data;
              resolve(res.data)
              // fn(this.spiderJobInfo.jobInfoId)
            }else{
              // 提交异常
              reject("Error code: " + JSON.stringify(res))
            }
          });
        }, 1000)
      }
    );

2、加载多个子组件

引入组件

<app-spider-form #test1></app-spider-form>
<app-image-check-form #test2></app-image-check-form>

3、父组件的component中引用子组件component

export class parentComponent implements OnInit,AfterViewInit{

// 引用子组件
@ViewChild('test1', {static: false}) test1;
@ViewChild('test2', {static: false}) test2;

constructor() {
  }

  ngOnInit() {
  }

ngAfterViewInit(){
    // 子组件加载完毕触发
    this.initSpiderJob();
}

initSpiderJob(){

    forkJoin([
      from(this.test1.initCreateJob()).pipe(catchError(error => of(`Bad Promise: ${error}`))),
      from(this.test2.initCreateJob()).pipe(catchError(error => of(error)))
      ])
      .subscribe(results => {
        console.log("results" + JSON.stringify(results))
      });
  }
	
}

个人博客 蜗牛

点击查看更多内容
TA 点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
  • 推荐
  • 评论
  • 收藏
  • 共同学习,写下你的评论
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消