Иногда данные не попадают в поле зрения (ngFor) через массив pu sh in angular 8 - PullRequest
0 голосов
/ 02 мая 2020

У меня есть простые данные, которые я заполняю через ngFor. Я получаю все объекты и помещаю их в массив, а затем оттуда заполняю html. Здесь все работает нормально. Но в моем проекте сценарий такой, как будто мне нужно попасть на эту страницу, выбрав событие на предыдущей странице. Когда я часто собираюсь и выбираю события и захожу на эту страницу, в некоторых случаях мои данные помещаются в массив, но не попадают в поле зрения. Есть какое-то решение для этого. Вот код ниже

home.component. html

<div>
<table>
<tr *ngFor="let x of groupList">
  <td ><span>{{x.vehicle_number}}</span></td>
  <td ><span>{{x.vehicle_name}}</span></td>
  <td ><span>{{x.status}}</span></td> 
</tr>
</table>
</div>

home.component. html

import { Component, OnInit } from '@angular/core';
import { CurrencyPipe } from './../pipes/currency.pipe';
@Component({
  selector: 'app-home',
  templateUrl: './home.component.html',
  styleUrls: ['./home.component.css']
})

export class HomeComponent implements OnInit {
imageSource :any;
statusdata1: any;
moreThanTen:boolean = false;
showit:boolean = false;
groupList:any = [];
constructor() {}

  ngOnInit() {
    /* First data */
    let response = 
    {"vehicle_number":1,"vehicle_name":"car","status":"yellow"}
    let response1 = {"vehicle_number":0,"vehicle_name":"car","status":"yellow"}
    let response2 = {"vehicle_number":2,"vehicle_name":"car","status":"yellow"}
    this.groupList.push(response,response1,response2);
    console.log(this.groupList);

  }

}

1 Ответ

0 голосов
/ 02 мая 2020

Пожалуйста, попробуйте внедрить onPush или ChangeDetectionStrategy в свой компонент

. При этом Angular будет запускать обнаружение изменений на этих компонентах и ​​их поддереве, только когда им передаются новые ссылки. по сравнению с тем, когда данные просто видоизменяются.

Запустите this.ref.markForCheck() или this.ref.detectChanges(), когда вы обновите переменную и хотите, чтобы она отображалась в html

Пожалуйста, проверьте следующие ссылки для получения дополнительной информации

https://angular.io/api/core/ChangeDetectionStrategy

https://alligator.io/angular/change-detection-strategy/

...