Question

我有一个返回如下所示的可观察对象的方法

constructor(private _http: HttpClient) {}

getUsers(location){
   return this._http.get(`https://someurl?location=${location}`)
          .pipe(
              map((response: any) => response),
              distinctUntilChanged()
           )
}

（请假定已导入所有必需的依赖项）

因此，为了显示用户结果，我调用loadUsers方法。

loadUsers(location){
   this.getUsers(location).subscribe( users => {
       this.userList = users;
    });
}

ngOnInit(){
    this.loadUsers('mumbai');
}

因此，以上代码为我所有拥有位置孟买的用户加载了用户列表。

现在，我在用户界面上有了一个位置列表，旁边是复选框

Mumbai,
Delhi,
Kerala

因此，单击一个位置将调用以位置名称为参数的loadUsers方法。

因此，当我再次从复选框中单击孟买时（在单击除孟买以外的任何其他复选框之前），我不想再次加载属于孟买的用户，因为该用户已加载。

我已经阅读到在这种情况下可以使用distinctUntilChanged（）。但是，它似乎对我不起作用，因为当我从复选框列表中选择孟买时，它仍然会呼叫孟买的loadUsers

PS-这不是真正的用例。上面的描述只是为了使大家明白我的问题。

我是Angular和Rxjs的新手。请帮忙。

Answer 1

您的distinctUntilChanged被应用于返回this._http.get()的响应。如果要防止再次在同一位置调用getUsers()，则必须重新编写代码，以使位置列表可观察到// //将next位置推入主题，以便可以使用distinctUntilChanged在此输入列表上。

const currentLocation = new Subject();
on('click', () => currentLocation.next(this.value)); // on your location list items checkboxes

currentLocation.pipe(
  distinctUntilChanged(),
  mergeMap(location => loadUsers(location)
)
.subscribe(users => {
  this.userList = users;
});

关于角度，我已经省略了很多样板，但我希望您能了解解决方案的要点。

distinctUntilChanged（）在角度6中无法按预期工作

1 个答案: