Angular 2 sessionStorage после хранения сессии устанавливает текущее значение без изменений - PullRequest
Новая
       27

Angular 2 sessionStorage после хранения сессии устанавливает текущее значение без изменений

0 голосов
/ 21 сентября 2018

Мне нужна помощь по проблеме sessionStorage.

Когда я изменяю значение из раскрывающегося списка, оно изменяется на странице, но после того, как я нажимаю на другую страницу и возвращаюсь, значение не сохраняется.Итак, что я сделал: 

handleOnItemsPerPage(itemsPerPage) {

  sessionStorage.setItem('itemsPerPage', JSON.stringify(itemsPerPage));

  this.onFilter.emit({
    items: this.cachedItems,
    field: 'type',
    type: this.selectedCategory,
    query: this.searchQuery,
    itemsPerPage: parseInt(itemsPerPage, 10),
    sortAsc: this.isAscSort,
    page: this.page
  });
}

Когда я изменяю значение, я сохраняю его в хранилище сессии, поэтому, когда я возвращаюсь, чтобы отобразить его.Так в моем ngInit: 

ngOnInit() {
   this.sessionStorage =  JSON.parse(sessionStorage.getItem('itemsPerPage'));
}

А в html: 

<app-pager [pagedItems]="pagedItems"
[itemsPerPage]="sessionStorage ? sessionStorage : itemsPerPage"
[page]="page"
(onPageChange)="handleOnPageChange($event)"
(onItemsPerPage)="handleOnItemsPerPage($event)">
</app-pager>

Проблема в том, что работает первый раз, если я изменяю значение и возвращаюсь на страницу, к которой он применяетсяизменения, но после того, как я снова изменю значение, оно не изменится на текущее значение, а на сессионное.

Как именно это исправить?Спасибо.

1 Ответ

0 голосов
/ 21 сентября 2018

Это изменится только при простой перезагрузке, после чего ngOnInit переключится.Если вы хотите изменить значение, вы должны изменить его и сохранить значение. 

sessionStorage.setItem('itemsPerPage', JSON.stringify(itemsPerPage));
this.sessionStorage =  itemsPerPage;

Если вы хотите узнать, почему двусторонняя привязка не работает, попробуйте: 

let a = 10;
let b = JSON.parse(JSON.stringify(a));

Обычно, если вы сделаете let b = a;, а затем измените ab, оно будет изменено на, но теперь вы можете изменить a, а b не изменится.Мы называем это глубокой копией.

...