Angular 2+表达在检查后发生了变化

时间:2018-04-05 23:39:02

标签: angular ngfor angular-changedetection

我知道在这个问题上有几个主题,但建议的修复程序对我不起作用。数据显示正确,然后很快消失。

据我所知,需要激活一轮变化检测。我用过:

  ngAfterViewInit() {
      this.cdr.detectChanges();
  }

但错误仍然存​​在。如果我将this.cdr.detectchanges()调用添加到increment()方法,它会产生一个循环并超出最大调用堆栈。

component.html:

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

相关组件:

ngAfterViewInit() {
  this.cdr.detectChanges();
}

setContainer(container: string) {
  this.messageContainer = container;
}


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++;
}

我的目标是让每个子项目都显示在表格

splitMessage Array console log

0 个答案:

没有答案