Сервисная подписка в ngOnInit вызывается один раз и не остается заполненной при изменении маршрута - PullRequest
0 голосов
/ 27 марта 2019

Просто чтобы уточнить. Это угловое приложение заполняет данные для представления, но когда я перемещаюсь от одного компонента к другому, ловушка жизненного цикла ngOnInit, кажется, не вызывается, что означает, что список в представлении остается пустым. Когда я нажимаю f5 (обновляю), данные на той странице, где я нахожусь, заполняются, что означает, что сервис работает нормально. Может ли быть так, что проблема связана с жизненным циклом?

Итак, учитывая, что у меня есть следующая коллекция в файле product.service.ts

 export class ProductsService {

  private productsCollection:AngularFirestoreCollection<Product>;
  private products:Observable<Product[]>;

  constructor(private afs:AngularFirestore) { 
    //Code was removed from here as it is beyond the scope of the problem
    //this.products is getting populated here successfully 
  }

 getProducts(){
   return this.products;
 }
}

И я подписываюсь на метод из двух отдельных компонентов следующим образом (используя тот же точный код ниже)

constructor(private productService:ProductsService) { }

      ngOnInit() {
        this.productService.getProducts().subscribe(
          products => {
              this.products = products;
          });

Таким образом, предполагая, что компонент A и компонент B оба имеют этот код, списки должны заполняться обоими компонентами при их загрузке. Когда я ввожу URL-адрес компонента, список заполняется, но когда я использую ссылки на маршрутизаторы, и данные не заполняются, и это похоже на то, как будто ngOnit не запускается при вызове нового маршрута. Оба представления показывают списки, но они не заполняются, когда я использую routerlink, в отличие от написания адреса или обновления страницы. Сервис доступен в app.module.ts в качестве провайдера. Некоторая помощь приветствуется.

1 Ответ

1 голос
/ 27 марта 2019

Используйте предмет поведения, а не наблюдаемый.Субъект поведения - это горячая наблюдаемая возможность, которая позволяет любым подписчикам извлекать существующие данные, которые уже были переданы в него.Одно отличие от субъекта поведения заключается в том, что вы отправляете данные с помощью метода .next.BehaviorSubjects также необходимо передать начальное значение при инициализации, в этом случае я передал значение null, так как я предполагаю, что ваш конструктор что-то делает для получения необходимых данных.Пример кода ниже:

 export class ProductsService {

     private productsCollection:AngularFirestoreCollection<Product>;
     private products:BehaviorSubject<Product[]> = new BehaviorSubject(null);

     constructor(private afs:AngularFirestore) { 
       //code here to set products
       this.products.next('data to set products here')
     }

     getProducts(){
        return this.products.asObservable();
     }
 }
...