Angular: данные, полученные из API, появляются только при первом запуске приложения - PullRequest
0 голосов
/ 11 декабря 2018

У меня просто есть два компонента, и приложение подключено к firebase (firestore).Данные, вызываемые в ngOnInit, исчезают, когда я перемещаюсь, и появляются снова, только если я вставляю сообщение или пользователя (формы). Почему?Может кто-нибудь мне помочь?

Маршруты:

const routes: Routes = [
  { path: "", component: HomeComponent, pathMatch: "full" },
  {
    path: "admin",
    component: AdminComponent
  },
  {
    path: "**",
    redirectTo: "/",
    pathMatch: "full"
  }
];

Сервис

itemsCollection: AngularFirestoreCollection<Post>;
  items: Observable<Post[]>;
  itemDoc: AngularFirestoreDocument<Post>;

  constructor(public afs: AngularFirestore) {


    this.itemsCollection = this.afs.collection('posts', ref =>
      ref.orderBy('date', 'desc')
    );

    this.items = this.itemsCollection.snapshotChanges().map(changes => {
      return changes.map(a => {
        const data = a.payload.doc.data() as Post;
        data.id = a.payload.doc.id;
        return data;
      });
    });
  }

  getItems() {
    return this.items;
  }

Компонент и подписка

 private postService: PostsService,

  ) {}

  ngOnInit() {
    this.postService.getItems().subscribe(data => {
      this.postInput = data;
    });

  }

Ответы [ 2 ]

0 голосов
/ 11 декабря 2018

На основании подсказок Kase44 мне удалось найти решение: завернуть захват идентификатора в функцию, вызвать ее в конструкторе службы и в ngOnInit ():

Служба

export class UsersService {

  usersCollection: AngularFirestoreCollection<Users>;
  userDoc: AngularFirestoreDocument<Users>;
  users: Observable<Users[]>;
  user: Observable<Users>;

  constructor(public afs: AngularFirestore) {

    this.usersCollection = this.afs.collection('employees', ref =>
      ref.orderBy('name', 'asc')
    );
this.getUserID();

  }

getUserID(){
  this.users = this.usersCollection.snapshotChanges().map(changes => {
    return changes.map(a => {
      const data = a.payload.doc.data() as Users;
      data.id = a.payload.doc.id;
      return data;
    });
  });
}

И составляющая:

     ngOnInit() {
    this.userService.getUsers().subscribe(data => {
      this.emp = data;

    });
    this.userService.getUserID();
  }
0 голосов
/ 11 декабря 2018

Создайте сообщения собственности в вашем сервисе.Затем подпишитесь на свой наблюдаемый в вашем сервисе, установите сообщения на то, что вы получаете от Firebase.Также не пишите свой код внутри конструктора, но включайте его в функцию и используйте его в OnInit в соответствующем компоненте.И, наконец, создайте тему, отправьте ей текущие сообщения и подпишитесь на них в onInit внутри нужных компонентов

posts = Post[]
postsChanged = new Subject<Post[]>()  

getItems(){
    this.itemsCollection.snapshotChanges().map(changes => {
      return changes.map(a => {
        return {
          id: a.payload.doc.id,
          ...a.payload.doc.data() 
        }
      }).subscribe(posts => {
           this.posts = posts
           this.postsChanged.next([...this.posts])
        })
   }
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...