Ember.js маршрутизация: как установить маршрут по умолчанию для немедленной визуализации?

Я уверен, что это станет ясным, когда я углублюсь в это, но пока неясно, как это сделать.

Я следил за информацией оэта полезная статья о маршрутизации но в примере не хватает важной части, т. е. как вы получаете «дом»? просматривать визуализацию сразу, не нажимая на кнопку «домой»; ссылка на сайт?

Я начал копаться в документах, чтобы попытаться разобраться в этом, но между тем мне кажется полезным ответить на вопрос для потомков.

Я играл с рабочим примером jsfiddle из приведенного выше вопроса.Вот и сравнивая с этим другим примером, я обнаружил, чтопохоже, что по умолчанию работает маршрутизация

Пока это все еще загадка.

Current code:

App.Router = Em.Router.extend({
  enableLogging: true,
  location: 'hash',

  root: Em.State.extend({
    // EVENTS
    goHome: Ember.State.transitionTo('home'),
    viewProfile: Ember.State.transitionTo('profile'),

    // STATES
    index: Em.State.extend({
        route: "/",
        redirectsTo: 'home'
    }),

    home: Em.State.extend({
        route: '/home',
        connectOutlets: function(router, context) {
            var appController = router.get('applicationController');
            appController.connectOutlet('home');
        }
    }),

    // STATES
    profile: Em.State.extend({
        route: '/profile',
            connectOutlets: function(router, context) {
              var appController = router.get('applicationController');
              appController.connectOutlet('profile');
            }
        }),
        doOne: function() {
            alert("eins");
        }
  }) 
});

UPDATE: Solution

Оказывается, причина, по которой пример, с которым я работал, не работал, заключалась в том, что он использовалEm.State.extend скорее, чемEm.Route.extend, Интересная часть состоит в том, что, когда я перехожу и заменяю их один за другим, пример не работает, пока я не изменю все из них.

Вот рабочаяпример:

App.Router = Em.Router.extend({
  enableLogging: true,
  location: 'hash',

  root: Em.Route.extend({
    // EVENTS
    goHome: Ember.State.transitionTo('home'),
    viewProfile: Ember.State.transitionTo('profile'),

    // STATES
    index: Em.Route.extend({
        route: "/",
        redirectsTo: 'home'
    }),

    home: Em.Route.extend({
        route: '/home',
        connectOutlets: function(router, context) {
            var appController = router.get('applicationController');
            appController.connectOutlet({name: 'home'});
        }
    }),

    // STATES
    profile: Em.Route.extend({
        route: '/profile',
            connectOutlets: function(router, context) {
              var appController = router.get('applicationController');
              appController.connectOutlet('profile');
            }
        }),
        doOne: function() {
            alert("eins");
        }
  }) 
});

Ответы на вопрос(3)

Похоже, что это делается сейчас. У меня был успех с этим способом сделать это:

App = Ember.Application.create();

App.Router.map(function() {
  // 'index' route is default
  this.resource('dashboard');
});

App.IndexRoute = Ember.Route.extend({
    redirect: function() {
        // this redirects / to /dashboard
        this.transitionTo('dashboard');
    }
});

App.DashboardRoute = Ember.Route.extend({
});

С Ember CLI вы можете поместить редирект в index.js в корневой каталог маршрутов:

import Ember from 'ember';

export default Ember.Route.extend( {
  redirect: function() {
    this.transitionTo('dashboard');
  }
});
Решение Вопроса

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

// Default route
$(function() {
    App = Em.Application.create();

    // Instantiated and wired up for you in App.initialize()
    App.ApplicationController = Em.Controller.extend();
    App.ApplicationView = Em.View.extend({
        templateName: 'application'
    });
    
    App.NavController = Em.Controller.extend({});
    App.NavView = Em.View.extend({ templateName: 'nav' });
    
    App.HomeController = Em.Controller.extend({});
    App.HomeView = Em.View.extend({ templateName: 'home' });
    
    App.ProfileController = Em.Controller.extend({});
    App.ProfileView = Em.View.extend({ templateName: 'profile' });
    
    App.Router = Em.Router.extend({
        enableLogging: true,
        location: 'hash',

        root: Em.Route.extend({
            goHome: Ember.State.transitionTo('home'),
            goProfile: Ember.State.transitionTo('profile'),
            
            index: Em.Route.extend({
                route: '/',
                redirectsTo: 'home'
            }),

            home: Em.Route.extend({
                route: '/home',

                connectOutlets: function(router, context) {
                    router.get('applicationController').connectOutlet({
                        name: 'home'
                    });
                }
            }),
            
            profile: Em.Route.extend({
                route: '/profile',

                connectOutlets: function(router, context) {
                    console.log("enter");
                    router.get('applicationController').connectOutlet({
                        name: 'profile'
                    });
                }
            })
        })
    });

    App.initialize();
});
<script type="text/x-handlebars" data-template-name="application">
    {{view App.NavView controllerBinding="controller.controllers.navController"}}
    <hr />
    <div class="content">
        {{outlet}}
    </div>
</script>

<script type="text/x-handlebars" data-template-name="nav">
    <h1>navigation:</h1>
    <button {{action goHome}}>home</button>
    <button {{action goProfile}}>profile</buton>
</script>

<script type="text/x-handlebars" data-template-name="home">
    <h1>Home...</h1>
</script>
<script type="text/x-handlebars" data-template-name="profile">
    <h1>Profile...</h1>
</script>

 radixhound23 июн. 2012 г., 18:23
Спасибо за рабочий пример. Мне потребовалось некоторое время, чтобы выяснить, в чем отличие от моего примера выше, но я наконец понял это. Пример, который я привел, не работал, потому что он использовалEm.State.extend скорее, чемEm.Route.extend

Ваш ответ на вопрос