arrays - 数组中的Typescript元素不可访问

这似乎是一个非常尴尬的问题:

我正在使用以下代码访问modal.service.ts:this.modalService.add('test');
我的modal.service.ts如下所示:

import { Injectable } from '@angular/core';

@Injectable({ providedIn: 'root' })
export class ModalService {
    private modals: any[] = [];

    add(modal: any) {
        // add modal to array of active modals
        this.modals.push(modal);
    }

    remove(id: string) {
        // remove modal from array of active modals
        this.modals = this.modals.filter(x => x.id !== id);
    }

    open(id: string) {
        // open modal specified by id
        const modal = this.modals.find(x => x.id === id);
        console.log(this.modals)
        console.log(this.modals[0])
        //modal.open();
    }

    close(id: string) {
        // close modal specified by id
        const modal = this.modals.find(x => x.id === id);
        modal.close();
    }
}

为什么当console.log(this.modals[0])给我输出“test”在pos 0处时，undefined给我this.modals吗？

这是控制台输出:

最佳答案

这是浏览器的console(或功能)存在的问题。它表明0的this.modals th元素是“测试”，因为在检查时是。但是在执行时，它是空的。

{
  const anArray = [];
  console.log(anArray);
  console.log(anArray[0]);
  anArray.push("foo");
}
// Browser's output:
// >>> []  <-- But expanded it will show [0: "foo"].
// >>> undefined

{
  const anArray = [];
  anArray.push("foo");
  console.log(anArray);
  console.log(anArray[0]);
}
// Browser's output:
// >>> ["foo"]  <-- See. Already pre-filled on display.
// >>> foo

因此，您实际拥有的是比赛条件。调用this.modals后，您的open会被填充。