2016-08-09 9 views
13

У меня есть приложение Aurelia, где пользователь может выбрать компанию, в которой они сейчас работают. Каждая страница в приложении зависит от выбранной в настоящий момент компании, и пользователь может выбрать новую компанию из выпадающего меню. Выпадающий элемент представляет собой компонент, расположенный на навигационной панели.Обновить текущую страницу в Aurelia

Я хочу, чтобы этот компонент перезагрузил текущую страницу в обработчике change.delegate без перезапуска приложения. Поэтому установка window.location.href не может быть и речи.

Есть ли способ заставить aurelia Router перезагрузить текущий маршрут/страницу?

Альтернатива была бы использовать EventAggregator сигнализировать изменение компании по всему приложению, но это потребует либо подписавшись на это событие на каждой странице или иметь все страницы наследуют от базового класса, который присоединяется к этому событию, но это гораздо более сложные варианты.

ответ

6

Это не отвечает на ваш точный вопрос, который является , как заставить перезагрузить текущий вид, но считаете ли вы, что к вашему маршруту (-ам) указан текущий идентификатор компании? Это решит вашу проблему и сделает ваши маршруты закладок: то есть: /#/company1/view1 и /#/company2/view1. Когда вы меняете компанию в раскрывающемся списке, вы вызываете router.navigate() с новым маршрутом, и новое представление будет загружено/обновлено.

Чтобы ответить на ваш точный вопрос, я опробовал параметры router.navigate: router.navigate('myroute', {replace:true, trigger:true}), и ни одна из них не заставит перезагрузить представление, если правильный вид уже загружен. Добавив ?ramdomNumber к названию маршрута, вы можете принудительно активировать представление.

+0

На самом деле я пытался прибавлением имени компании маршрутам ('/ приборной панели/company1') вместо того, чтобы использовать случайное число, но это не сработало ...И теперь я понимаю, что это связано с тем, что мне нужно было определить маршрут '' dashboard /: company "':/ –

+0

Это работало бы с '?' Как в '/ dashboard? Company1' not'/'. – Sylvain

+0

А, хорошо, я пропустил эту тонкость. –

0

Вот простое решение для обновления страницы: в Aurelia-истории-browser.js, добавил проверку в updateHash() и если новый _HREF равно старый, то перезагрузите страницу из кэша (не сервер).

Затем, чтобы обновить страницу нужно просто использовать существующие возможности:

router.navigateToRoute('watch', {}, { replace: true, trigger: true }); 

Обновленный код копируется ниже:

function updateHash(location, fragment, replace) { 
    if (replace) { 
     var _href = location.href.replace(/(javascript:|#).*$/, '') + '#' + fragment; 
     if (_href == location.href) 
     location.reload(false); 
     else 
     location.replace(_href); 
    } else { 
     location.hash = '#' + fragment; 
    } 
    } 
6

Хотя официально не поддерживается, есть множество хаки предложения in a relevant GitHub issue с просьбой об этом очень функциональность.

Тот, который я получил работу, которая не включает в себя обновление исходного кода Aurelia, ни добавляя лишние данные на маршрут, чтобы установить activationStrategy на все мои маршруты быть invokeLifecycle вместо значения по умолчанию, например, так:

export class App { 

    configureRouter(config, router) { 
    config.map([ 
     { 
     route: ['', 'home'], 
     name: 'home', 
     moduleId: 'home/index', 
     activationStrategy: activationStrategy.invokeLifecycle 
     }, 
     { 
     route: 'users', 
     name: 'users', 
     moduleId: 'users/index', 
     nav: true, 
     activationStrategy: activationStrategy.invokeLifecycle 
     }, 
     ... etc ... 
    ]); 
    } 

} 

Это делает так, что метод маршрута activate() будет работать так, как вы ожидаете, когда модель просмотра будет перезагружена. Затем в коде, который инициирует перезагрузку, я делаю следующее:

this.router.navigateToRoute(
    this.router.currentInstruction.config.name, 
    this.router.currentInstruction.params, 
    { replace: true } 
); 
+0

Интересно ... Я отдам! –

+0

Ты мой герой, это прекрасно! – Xceno

+0

Лучший ответ спасибо! спас бы мне всего несколько минут, если бы вы сообщили мне, что я могу импортировать {activationStrategy} из 'aurelia-router'' – weagle08

Смежные вопросы