Question

更新：我尝试过像@Kobe建议的那样进行日志记录：console.log(JSON.stringify(this.idTitleDict))。这显示了空的花括号…有关此字典的所有代码（声明，填充它）都在下面。我首先调用this.getTemplates()来填充字典，然后在下一行进行迭代。将字典传递给JSON.stringify()后，当我将其登录到控制台时，此时似乎是空的。

在我的角度应用程序中组件的ngOnInit方法中，我遍历字典以获取第一个键，然后退出循环。但似乎并没有迭代结束。

字典看起来像这样：

{
  1: "title",
  2: "title",
  3: "title",
  4: "title",
  5: "title",
  6: "title"
}

我尝试过：

const keys = Object.keys(this.idTitleDict);
for (const key in keys) {
  if (this.idTitleDict.hasOwnProperty(key)) {
    console.log(key);
      this.showContent(key);
      break;
    }
  }

还：

for (const key in this.idTitleDict) {
      if (this.idTitleDict.hasOwnProperty(key)) {
        console.log(key);
        this.showContent(key);
        break;
      }
    }

还：

for (const key in Object.keys(this.idTitleDict)) {
      if (this.idTitleDict.hasOwnProperty(key)) {
        console.log(key);
        this.showContent(key);
        break;
      }
    }

没有任何内容登录到控制台，并且this.showContent()未执行。我肯定知道，因为我检查了字典。在另一个函数中，我遍历另一本词典，并且没有问题：

getTemplates() {
    this.apiService.getTemplates().subscribe(
      (data: any) => {
        for (const key in data) {
          if (data.hasOwnProperty(key)) {
            this.idTitleDict[key] = data[key].title;
          }
        }
      }
    );
  }

完整的ngOnInit方法：

ngOnInit() {
    this.getTemplates();
    const keys = Object.keys(this.idTitleDict);
    console.log(this.idTitleDict); // this shows the dictionary is populated as shown in the dictionary at the top of this post
    for (const key in Object.keys(this.idTitleDict)) {
      if (this.idTitleDict.hasOwnProperty(key)) {
        console.log(key);
        this.showContent(key);
        break;
      }
    }
  }

字典的声明：

idTitleDict: { [id: string]: string; } = {};

此方法已完成：

getTemplates() {
    this.apiService.getTemplates().subscribe(
      (data: any) => {
        for (const key in data) {
          if (data.hasOwnProperty(key)) {
            this.idTitleDict[key] = data[key].title;
          }
        }
      }
    );
  }

我可能错过了一些东西，但是我精打细算。

Answer 1

如果只想为第一个键调用方法，为什么不简单地像下面这样

const keys = Object.keys(this.idTitleDict);
if(keys.length){
    this.showContent(keys[0]);
}

Answer 2

您可以使用Object.keys()和[0]仅在第一项上呼叫showContent：

const obj = {'1': "title1", '2': "title2", '3': "title3", '4': "title4", '5': "title5", '6': "title6"},
  showContent = console.log

showContent(Object.keys(obj)[0])

另一种方法是使用for循环并立即中断：

const obj = {'1': "title1", '2': "title2", '3': "title3", '4': "title4", '5': "title5", '6': "title6"},
  showContent = console.log

for (var key in obj) break
showContent(key)

Answer 3

似乎代码执行时对象没有数据。试试这个来确认。

let self = this;
setTimeout(function(){
  const keys = Object.keys(self.idTitleDict);
  for (const key in keys) {
    if (self.idTitleDict.hasOwnProperty(key)) {
      console.log(key);
        self.showContent(key);
        break;
      }
    }
},1000);

Answer 4

由于Object.keys()的返回类型为Array，因此您应该使用 for..of 循环，而不要使用 for ... in 这种情况下返回的是索引数组，但不是对象键。

主要问题是this.getTemplates()的行为是异步的（从API提取数据始终是），并且那时对象是空的，因此使用字典的工作应移至另一个生命周期挂钩（也许是OnChanges）。 / p>

为什么我不能遍历字典/键数组

4 个答案: