Aurelia - отключить сброс на маршрутизатор ракурсе

Question

Моих форм продолжают перезапуск, если я изменю язычки на маршрутизатор ракурсе, есть способ предотвратить это (если не то, что альтернатива)

export class App { 
configureRouter(config, router) { 
config.title = "Aurelia"; 
config.map([ 
    { route: ["", "dashboard"], name: "dashboard", moduleId: "HTML/viewmodels/dashboard", nav: true, title: "Dashboard", settings: "icon-home" }, 
    { route: "addons", name: "addons", moduleId: "HTML/viewmodels/addons", nav: true, title: "Addons", settings: "icon-file" }, 
    { route: "error", name: "error", moduleId: "HTML/viewmodels/error", nav: true, title: "Error", settings: "icon-info-sign" } 
]); 

this.router = router; 
console.log(router); 
    } 
} 

Answer 1

Это состояние сохраняющегося вопрос. Самое простое решение для сохранения состояния в:

• родительского вид
• неиспользования связанного одноплодном классе (или статических переменных)
• LocalStorage сохраняющийся (возможно, совпадающий с предыдущей опцией)

---

Первый способ сделать это: сохранить его в родительском представлении.

Например, вы можете создать кэш внутри App класса:

export class App { 
    formData = {}; 

    configureRouter(config, router) { 
    { route: ["", "dashboard"], [..snip..] settings: { formData: this.formData, icon: 'icon-home' } } 
    } 
} 

Внутри вашей точки зрения, вы можете сделать:

activate(params, routeConfig) { 
    this.formData = routeConfig.settings.formData; 
    this.icon = routeConfig.settings.icon; 
} 

И в HTML, просто привязать его к formData:

<input type="text" value.bind="formData.text" /> 

Этот вид предполагает, тх t целое App вращается вокруг этой формы. В противном случае на самом деле не было бы смысла хранить его там.

Это один из способов сделать это, во всяком случае (первое, что я указал в списке).

---

Другой способ сделать это: одиночки.

Создайте новый класс под названием AppState или что-то в этом роде.

export class AppState { 
    formData = {}; 
} 

Затем на ваш взгляд, вы должны импортировать и ввести его:

import { AppState } from './app-state'; 

export class YourView { 
    static inject = [AppState]; 

    constructor(appState) { 
    this.appState = appState; 
    } 
} 

И тогда в вашем HTML, вы можете связать его следующим образом:

<input type="text" value.bind="appState.formData.text" /> 

---

Или третий способ: статический класс.

Создайте новый класс под названием AppState или что-то в этом роде.

export class AppState { 
    static formData = {}; 
} 

Затем на ваш взгляд, вы должны импортировать и ввести его: импорт {AppState} из»./ Приложение-государство ";

export class YourView { 
    AppState = AppState; 
} 

И тогда в вашем HTML, вы можете связать его следующим образом:

<input type="text" value.bind="AppState.formData.text" />