在Angular 7项目中使用NGXS和Firestore时，可能会遇到冗余问题。这是因为Firestore是一个实时数据库，当数据更改时，它会自动同步更新。然而，NGXS也具有状态管理功能，并且可以使应用程序具有实时性。因此，当使用这两个库时，可能会出现冗余的数据更新。

为了解决这个问题，可以采取以下步骤：

1. 避免在NGXS中直接使用Firestore集合/文档的实时观察者。相反，使用Firestore的原生API来进行查询和订阅，然后将数据手动分发到NGXS store中。

例如，假设你有一个名为users的Firestore集合，并且你希望将其数据存储在NGXS store中。你可以创建一个服务来处理Firestore数据的查询和订阅：

import { Injectable } from '@angular/core';
import { AngularFirestore } from '@angular/fire/firestore';
import { Store } from '@ngxs/store';
import { SetUsers } from './store/users.actions';

@Injectable({
  providedIn: 'root'
})
export class UserService {
  constructor(private firestore: AngularFirestore, private store: Store) {}

  getUsers() {
    this.firestore.collection('users').valueChanges().subscribe(users => {
      this.store.dispatch(new SetUsers(users));
    });
  }
}

然后，在你的组件中使用这个服务来获取数据：

import { Component, OnInit } from '@angular/core';
import { UserService } from './user.service';
import { UserState } from './store/users.state';
import { Select, Store } from '@ngxs/store';
import { Observable } from 'rxjs';

@Component({
  selector: 'app-users',
  template: `
    

      
{{ user.name }}
    
  `
})
export class UsersComponent implements OnInit {
  @Select(UserState.getUsers) users$: Observable;

  constructor(private userService: UserService) {}

  ngOnInit() {
    this.userService.getUsers();
  }
}

这样，你就可以在NGXS store中存储Firestore数据，并使用NGXS的选择器来获取数据。

2. 在NGXS store中使用@Action装饰器来处理与Firestore的交互，而不是直接在组件中进行。

例如，假设你有一个名为users的Firestore集合，并且你希望在用户创建时将其数据保存到Firestore中。你可以创建一个UserActions类来处理这个操作：

import { Action, Selector, State, StateContext } from '@ngxs/store';
import { AngularFirestore } from '@angular/fire/firestore';
import { tap } from 'rxjs/operators';
import { AddUser } from './users.actions';

export interface User {
  id: string;
  name: string;
}

@State({
  name: 'users',
  defaults: []
})
export class UserState {
  constructor(private firestore: AngularFirestore) {}

  @Selector()
  static getUsers(state: User[]) {
    return state;
  }

  @Action(AddUser)
  addUser(ctx: StateContext, action: AddUser) {
    const user = action.payload;
    return this.firestore.collection('users').add(user).pipe(
      tap(() => {
        ctx.patchState([...ctx.getState(), user]);
      })
    );
  }
}

然后，在你的组件中使用这个Action来添加用户到Firestore：

import { Component } from '@angular/core';
import { AddUser } from './store/users.actions';
import { Store } from '@ngxs/store';

@Component({
  selector: 'app-add-user',
  template: `
    

      
      Add User
    
  `
})
export class AddUserComponent {
  name: string;

  constructor(private store: Store) {}

  addUser(event: Event) {
    event.preventDefault();
    this.store.dispatch(new AddUser({ id: '', name: this.name }));
    this.name = '';
  }
}

这样，你就可以在NGXS store中处理与Firestore的交互，并使用NGXS的Action来触发这些交互。