我有一个包含两个组件的主列表应用程序:usersList
和usersMap
,它们都持有private users
变量,从服务中获取数据。
两人都订阅了users-service
,其中有Users array
和users data
。
此阵列上的每个更改都将导致两个组件呈现并更新其用户变量。
当我创建一个新用户时,users array
会更新,usersList
会被重新渲染,但usersMap不是。
我尝试了堆栈上提供的一些解决方案,但它们没有用。例如:Angular2 Observable BehaviorSubject service not working
链接到github:https://github.com/TomerOmri/angular-users-map/tree/master/test-app/src/app
UserList
成分:https://github.com/TomerOmri/angular-users-map/blob/master/test-app/src/app/userlist/userlist.component.tsUserMap
成分:https://github.com/TomerOmri/angular-users-map/blob/master/test-app/src/app/usersmap/usersmap.component.tsUser
服务: import { Injectable } from '@angular/core';
import { Observable } from "rxjs/Observable";
import { of } from "rxjs/observable/of";
import { User } from "./user";
import { USERS } from "./users-mock";
@Injectable()
export class UserService {
constructor() { }
getUsers(): Observable<User[]> {
var userList = of(USERS);
return userList;
}
}
使用以下代码执行任务:
@Injectable()
export class UserService {
private userList = USERS;
public users = new BehaviourSubject<any>(userList);
constructor() { }
addUser(user): {
this.userList.push(user);
this.users.next(this.userList);
}
现在在两个组件中使用此users属性来获取数据。当你需要添加只是调用addUser方法的服务时。希望它会有所帮助。