在我点击链接两次之前，我的新闻提要不会显示答案

【问题标题】：my news feed don't display until i click the link twice在我点击链接两次之前，我的新闻提要不会显示
【发布时间】：2020-04-13 05:17:37
【问题描述】：

我正在开发这个显示来自 Firebase 数据库的新闻的小应用程序，但是当我突然转到新闻链接或提要时，它不会显示，直到我点击导航栏中的链接两次我正在使用 Angular 请帮助

这是我的服务文件：

import {Injectable} from '@angular/core';
import {AngularFireDatabase} from 'angularfire2/database';


@Injectable({
  providedIn: 'root'
})
export class NewsService {
  list: any[];

  constructor(db: AngularFireDatabase) {
    db.list('/actu').valueChanges()
      .subscribe(list => {
        this.list = list;
        console.log(this.list);
      });
  }

  Getlist() {
    return this.list;
  }

  getnews(title: string) {
    return this.list.find(value => value.titre === title);
  }
}

【问题讨论】：

标签： angular typescript firebase angularfire2

【解决方案1】：

最好不要不执行构造函数中的调用，也不要 subscribe() 到服务内部的 observable。相反，在显示此数据的组件中返回并订阅它。

news.service.ts

import {Injectable} from '@angular/core';
import {AngularFireDatabase} from 'angularfire2/database';


@Injectable({
  providedIn: 'root'
})
export class NewsService {

  constructor(private db: AngularFireDatabase) {
  }

  Getlist() {
    return db.list('/actu').valueChanges();
  }
}

news.component.ts

import { NewsService } from './news.service';
//component declarations and imports ...
export class NewsComponent implements OnInit {
   list: any[];
   constructor(private newsService: NewsService){}

   buttonClicked(){
      this.newsService.Getlist().subscribe(list => {
        this.list = list;
        console.log(this.list);
      })
   }
}

news.component.html

<a (click)="buttonClicked()">nav button</a>

当然，这不会是您的服务、组件或 html 中的唯一代码。它只是突出您的问题的代码。

【讨论】：