Question

我正在使用rxjs 5.5.12开发Angular 5.2应用

我有一个具有2个按钮的组件：第一个按钮是日历或列表图标，具体取决于isCalendarView$的状态如果单击此按钮，它将发出一个新的Action，并且存储中的isCalendarView$变量将被切换（因此如果以前是false，则现在是true ）。

第二个按钮导航到另一个页面

<div (click)="changeView()">
  <i class="fas icon pt-1" [ngClass]="(isCalendarView$ | async) ? 'fa-list' : 'fa-calendar-alt'"></i>
</div>
<button (click)="toCreateRequest()" class="btn btn-primary icon-left">
  Navigate Away!
</button>

该组件看起来像这样

export class MyCalendarComponent implements OnInit {
  isCalendarView$ = this.store.select(selectIsCalendarView);

  constructor(private store: Store<Appstate>,
              private router: Router) {
  }

  ngOnInit(): void {
  }

  toCreateRequest(): void {
    this.router.navigate(['/vacationRequests']);
  }

  changeView(): void {
    this.store.dispatch(new ToggleCalendarViewFromMyCalendar());
  }
}

现在在“ / vacationRequests”路径中找到的目标组件中，我有一个按钮可导航回到最后一页。为此，我尝试使用Angular的Location服务

  back(): void {
    this._location.back();
  }

这是问题所在：当我回到原始页面时，如果isCalendarView$发生更改，视图（模板）将不再更新，但是按钮仍然可以使用。因此，如果按第一个按钮来切换存储中的isCalendarView$值，则状态实际上会在存储中发生变化，但在我的视图中不会检测到。

如果我在组件自身中订阅了isCalendarView$并记录了结果，则可以看到在那边确实检测到该变量已切换，但是视图仍然没有改变。

这仅在我使用this._location.back();或this.history.back();导航时发生

如果我像this.router.navigate(['/myCalendar']这样使用路由器导航，那么就没有问题了！

您知道导致此问题的原因是什么吗？

向后导航后，角度视图不再更新

0 个答案: