Как снести расширенный фрагмент
Я работаю над существующим SPA, где мы постепенно заменяем компоненты компонентами Aurelia. Мы используемenhance
APITemplatingEngine
, Это работает довольно хорошо, но мы также должны разрушить эти расширенные фрагменты (удалить прослушиватели событий, ...) при переходе в другую часть приложения (без перезагрузки страницы).
Моя идея - сохранить экземпляр aurelia на странице и использовать его повторно.
В настоящее время я улучшаю фрагменты как это:
function enhanceFragment(targetElement) {
function proceed() {
let aurelia = window.DFAurelia;
let engine = aurelia.container.get(TemplatingEngine);
engine.enhance({
container: aurelia.container,
element: targetElement,
resources: aurelia.resources
});
}
if (!window.DFAurelia) {
bootstrap(async aurelia => {
aurelia.use
.defaultBindingLanguage()
.defaultResources()
.eventAggregator()
.developmentLogging()
.globalResources('app/df-element');
await aurelia.start();
window.DFAurelia = aurelia;
proceed();
});
} else {
proceed();
}
}
HTML-код, который я улучшаю, выглядит следующим образом:
<df-element></df-element>
Я попробовал это в функции самого пользовательского элемента (DfElement::removeMyself()
):
let vs: ViewSlot = this.container.get(ViewSlot);
let view: View = this.container.get(View);
vs.remove(view);
vs.detached();
vs.unbind();
но я получаю ошибку при получении представления из контейнера (Не удается прочитать свойство 'resources' из неопределенного). Я вызвал эту функцию из обработчика кликов.
Главный вопрос: как вручную вызватьunbind
а такжеdetached
крючкиDfElement
а также его дети?
Бонусные вопросы: свойства моегоaurelia
пример (window.DFAurelia
) root
а такжеhost
не определены: это плохо? Видите ли вы потенциальную проблему с этим способом улучшения (и не усиления) фрагментов на странице?