如何加载自定义路由模板

how to load custom route template?

本文关键字：自定义 路由 加载 何加载      更新时间：2023-09-26

在我下面的代码中，我试图加载'home'路由模板作为我的索引路由?

我该怎么做?那么主路由模板必须只加载吗?

我不想看到应用程序模板并使用它的{{outlet}}。

谢谢你的帮助

var App = Ember.Application.create();
App.Router.map(function(){
    this.resource('home', {path: ''} );
    //this.resource('home', {path: '/h'} );
    this.resource('about', {path: '/a'} );
    this.resource('contact', {path: '/c'} );
});
App.ApplicationRoute = Ember.Route.extend({
    redirect: function() {
        this.transitionTo('contact'); 
    }
});
App.IndexRoute = Ember.Route.extend({
  redirect: function() {
   this.transitionTo('home'); 
  }
});
App.HomeRoute = Ember.Route.extend({
});
App.AboutRoute = Ember.Route.extend({
});
App.ContactRoute = Ember.Route.extend({
});

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Ember Starter Kit</title>
</head>
<body>
  <script src="js/libs/jquery-1.10.2.js"></script>
  <script src="js/libs/handlebars-1.1.2.js"></script>
  <script src="js/libs/ember-1.5.1.js"></script>
  <script src="js/attempt1.js"></script>

<script type="text/x-handlebars">
   <div>
     page - Application
   </div>
   {{outlet}}
 </script>
<script type="text/x-handlebars" id="home">
  <div>
    page - Home
  </div>
</script>
<script type="text/x-handlebars" id="about">
  <div>
    page - About
  </div>
</script>
<script type="text/x-handlebars" id="contact">
  <div>
    page - Contact
  </div>
</script>

</body>
</html>

change id for data-template-name:

<script type="text/x-handlebars" data-template-name="home">
  <div>
    page - Home
  </div>
</script>
相关文章：