Как отобразить вложенный маршрут на новой странице Ember js? - PullRequest
Новая
       16

Как отобразить вложенный маршрут на новой странице Ember js?

2 голосов
/ 16 апреля 2020

Я сейчас пытаюсь использовать LinkTo для рендеринга другого вложенного маршрута с помощью тега {{outlet}} на другую новую страницу.

У меня есть форум route и вложенный forum details маршрут

В шаблоне форума: 

<LinkTo @route="main.forum.forum-details" @model={{post}}>{{post.title}}</LinkTo>

{{outlet}}

enter image description here

Как на картинке выше. Вложенный маршрут будет отображаться внизу, а не на новой странице. Как я собираюсь сделать это на новой странице? Я думал, что LinkTo действительно свяжет это с новой страницей правильно? А подробности форума должны отображаться в теге {{outlet}}, поэтому где я должен разместить тег {{outlet}}, чтобы он мог отображаться на новой странице?

1 Ответ

0 голосов
/ 17 апреля 2020

Ваша проблема в том, что вам нужно понимать вложенные маршруты .

Если ваш маршрут main.forum.forum-details, это означает, что ваш маршрутизатор выглядит следующим образом: 

this.route('main', function() {
  this.route('forum', function() {
    this.route('forum-details');
  });
});

Таким образом, маршрут forum является родительским маршрутом forum-details.

И важно понимать, что родительские маршруты всегда видны при посещении дочернего маршрута.

Таким образом, для main.forum.forum-details ember будет отображать ваш маршрут application, а внутри его {{outlet}} будет отображаться маршрут forum, а внутри этого {{outlet}} будет отображаться маршрут forum-details.

Поэтому, если вы хотите или forum или forum-details маршрут, вы можете реструктурировать свои маршруты: 

this.route('main', function() {
  this.route('forum');
  this.route('forum-details');
});

или вы можете переместить то, что вы в данный момент иметь в своем forum маршрут к вашему forum.index маршруту. Если у маршрута есть подчиненные маршруты, и ни один из них не активен, всегда будет активным маршрут index, который вы можете использовать.

...