Angular 2+ ngFor 使用索引变量作为数组指针答案

【问题标题】：Angular 2+ ngFor using index variable as array pointerAngular 2+ ngFor 使用索引变量作为数组指针
【发布时间】：2018-04-05 21:43:44
【问题描述】：

是否可以将索引变量用作数组指针？

 <div *ngFor="let item of messageSplit[i]; let i = index">
     <td>{{item}}</td>
  </div>

我没有收到任何错误，但没有显示任何内容。我已经尝试在 component.ts 中调用一个函数，如下所示，但这导致了很多其他问题。

 <div *ngFor="let item of messageSplit[incrementArray()]">
     <td>{{item}}</td>
 </div> 

 incrementArray() {
     return this.counter++;
 }

这是我的 component.ts 文件中的相关方法，以防需要进一步了解问题

messageSplit = new Array;

loadMessages() {
this.messageSplit = [];
const currentUserId = +this.authService.decodedToken.nameid;
this.userService.getMessages(this.authService.decodedToken.nameid,
  this.messageContainer)
  .do(messages => {
    _.each(messages, (message: Message) => {

      if (this.messageContainer !== 'unread') {
        if (this.compareArray(message) !== true) {
          this.splitMessages(message);
        }
      }
      if (message.isRead === false && message.recipientId === currentUserId) 
  {
        this.userService.markAsRead(currentUserId, message.id);
      }
    });
  }, error => {
    console.log('');
  }, () => {
    console.log(this.messageSplit);
    this.splitReady = true;
  })
  .subscribe((res: Message[]) => {
    this.messages = res;
  });
}

compareArray(message) {
  let count = 0;
  for (let i = 0; i < this.messageSplit.length; i++) {
    if (message.content !== null) {
      if (this.messageSplit[i] === message.content.split(',')) {
        count = count + 1;
      }
    }
  }
  if (count > 0) {
    return true;
  }
  return false;
}

splitMessages(message) {
  if (message.content !== null) {
    this.messageSplit.push(message.content.split(','));
  }
}

increment() {
  return this.counter++;
}

【问题讨论】：

你的目标是什么？可以嵌套*ngFor's
您的编辑提供了零清晰度。我们需要查看messageSplit 中的console.log - 这样我们才能看到其中包含的实际数据。

标签： angular ngfor

【解决方案1】：

ngFor 仅适用于数组。 messageSplit[i] 将只返回一个元素，您将无法遍历它（除非 messageSplit[i] 返回一个数组）。请提供messageSplit的详细信息。这将有助于回答问题。

【讨论】：

messageSplit[i] 确实返回一个数组。