Как обновить предыдущую страницу после закрытия текущей страницы в OnSen и Angular 2+

Для обновления страницы не требуется специального кода angular. location.reload() сделает свое дело.

При этом обновление страницы здесь было бы плохой идеей. Мало того, что может быть значительная задержка для пользователя, но сброс страницы стирает все состояние внешнего интерфейса. Это означает, что любая функциональность, реализованная с помощью angular, возвращается к значениям по умолчанию при перезагрузке страницы. По этой причине при разработке шрифтов с использованием клиентской библиотеки, такой как angular или react, мы хотим любой ценой избежать перезагрузки страницы.

Вместо этого вам следует разработать решение на стороне клиента, чтобы показывать ваш новый продукт после того, как пользователь отправит его в базу данных. У вас уже есть вся информация локально (потому что вы только что отправили ее!), нет причин, по которым вам нужно снова запрашивать базу данных, чтобы получить ее обратно.

let products = [];

// Pretend this is the product that we're adding
let product:Product = new Product('my favorite product');

sendToDb(product);
products.add(product);

Предположим, что продукт выглядит так:

class Product {
  name:string

  constructor(name:string) {
    this.name = name;
  }
}

Тогда на ваш взгляд:

<ul *ngFor="let products of product">
  <li>{{product.name}}</li>
</ul>

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

nmg49 - Спасибо за помощь. Да, это способ общения между двумя компонентами в Angular, но в OnSen, я думаю, он немного отличается. Пожалуйста, поправьте меня, если я ошибаюсь.

В любом случае мне удалось добиться того, чего я хотел. Это может быть не лучшая практика или правильный способ сделать это, но я буду придерживаться этого, пока не найду лучшее решение.

Из моего нового компонента продукта я заменил его страницей со списком продуктов, а не просто открывал ее. При этом новый список продуктов будет создан поверх стека со свежими данными. Но тогда будет 2 списка продуктов в стеке впритык. Сверху с обновленными данными, 2-й сверху со старыми данными. Теперь удалите 2-й верхний список продуктов из стека, и теперь все в порядке.

Ниже мой код.

this.navi.nativeElement.replacePage (ProductListPageComponent, {слайд: «левый»}); this.navi.nativeElement.removePage(1); // 1 представляет собой индекс предыдущего компонента ProductListPageComponent, в вашем случае он будет другим.

Пожалуйста, дайте мне знать, если есть лучший способ сделать это.