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

Angular admin 11个月前 (11-26) 68次浏览 0个评论 扫描二维码

1、子component中的异步方法


// 数据双向绑定, myVo的input和 myVoChange的output是特定写法 @Input() get myVo() { return this._myVo; } set myVo(val: MyVo) { this._MyVo = val; this.myVoChange.emit(val); } @Output() myVoChange: EventEmitter<any> = new EventEmitter(); 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 [(myVo)]="parentData"                  (myVoChange)="parenFun()"></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))
      });
  }

}

4、ts字符串转数字 根据数组内对象的key进行排序

this.allSep.sort((o1,o2) => Number(o1.value)- Number(o2.value));

5、ts中的switch case

switch(value) {
      case "1": {
        // 全量 每个月的第一天的0点执行
        this.test.a = "0 0 0 1 */1 ?";
        break;
      }
      case "2": {
        // 增量 每天的0点执行
        this.test.a = "0 0 0 */1 * ?";
        break;
      }
      default: {
        break;
      }
    }

6、ts 字符串拼接,ts字符串中使用变量

const value = "1";
const mode = `0 0 0 1 */${value} ?`

codeobj , 版权所有丨如未注明 , 均为原创丨本网站采用BY-NC-SA协议进行授权
转载请注明原文链接:Angular中ViewChild\ngAfterViewInit\Promise的使用,在父组件初始化时等待子组件的返回值
喜欢 (0)
[a37free@163.com]
分享 (0)
发表我的评论
取消评论
表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址