这个数组是未定义的，但为什么呢？

Question

我想检查一个数组，直到它被填满并显示一个加载对话框，但它总是告诉我

this.events[0] is undefined

ngOnInit() {
  this.initMethod();
  if(this.events[0].start == this.books[0].date_from_og) {
    this.dialog.closeAll();
  } 
}

但是不能取消定义事件，因为它包含要显示的日历事件。

  initMethod() {
    this.service
     .getEmployees()
     .subscribe(
     (listBooks) => {
       this.books = listBooks;
       this.events = this.books.map((book) => {
         return {
           start: new Date(book.date_from_og),
           end: new Date(book.date_to_og),
           type: ""+book.type,
           title: "" + book.device + "",
           color: colors.blue,
           actions: this.actions,
           resizable: {
             beforeStart: false,
             afterEnd: false
           },
           draggable: false
         }
       });
     },
     (err) => console.log(err)
   );
  }
}

和构造函数：

constructor(private modal: NgbModal, private service: BookingService, private dialog: MatDialog) {
   this.initMethod();

   this.dialog.open(DialogLaedt, {
      width: '650px'
   });

Answer 1

您的问题是您 initMethod() 异步检索结果。

因此，当您到达带有 if(this.events[0].start == ... 的行时，无法保证已从服务中检索到事件数据。

解决方法是将检查移动到 init 方法的订阅部分（一旦 observable 发出它的值就会执行），或者让 init 方法 return 成为一个你可以订阅的 observable ，并在该订阅内执行检查。

解决方案 1 - 将您的支票移至订阅内

ngOnInit() {
  this.initMethod();
}

initMethod() {
  this.service
   .getEmployees()
   .subscribe(
   (listBooks) => {
     this.books = listBooks;
     this.events = this.books.map((book) => {
       return {
         start: new Date(book.date_from_og),
         end: new Date(book.date_to_og),
         type: ""+book.type,
         title: "" + book.device + "",
         color: colors.blue,
         actions: this.actions,
         resizable: {
           beforeStart: false,
           afterEnd: false
         },
         draggable: false
       }

       if(this.events[0].start == this.books[0].date_from_og) {
         this.dialog.closeAll();
       } 
     });
   },
   (err) => console.log(err)
 );
}

解决方案 2 - 让您的 initMethod return 成为 Observable

ngOnInit() {
  this.initMethod().subscribe(() => {
      if(this.events[0].start == this.books[0].date_from_og) {
          this.dialog.closeAll();
      } 
  });
}


initMethod() {
    return this.service
    .getEmployees()
    .pipe(tap(
    (listBooks) => {
        this.books = listBooks;
        this.events = this.books.map((book) => {
        return {
            start: new Date(book.date_from_og),
            end: new Date(book.date_to_og),
            type: ""+book.type,
            title: "" + book.device + "",
            color: colors.blue,
            actions: this.actions,
            resizable: {
            beforeStart: false,
            afterEnd: false
            },
            draggable: false
        }
        });
    }))
}

Answer 2

我注意到您调用了 initMethod() 两次。一次在 constructor 中，一次在 ngOninit 方法中。

这个数组是未定义的，但为什么呢？

This Array is undefined but why?

arrays

undefined

angular

解决方案 1 - 将您的支票移至订阅内

解决方案 2 - 让您的 initMethod return 成为 Observable