javascript - 实现路由以显示某些视图的最简单方法是什么？

Question

我创建了一个站点，该站点具有多个从屏幕右侧滑入的面板。

我希望能够在将共享我的网页的每个面板上放置一个链接，并且当用户访问该站点时，该特定面板将打开。

例如：

www.something.com/#/panel-1

将显示打开 panel-1 的页面，同时：

www.something.com/#/panel-2 将显示打开 panel-2 的页面。

最简单的方法是什么？我可以仅使用简单的 html 来使用 Ember、Angular 或 Backbone 的路由器和视图吗？我应该只使用 router.js 之类的东西吗？

任何帮助、建议或链接将不胜感激。

Answer 1

你当然可以这样做。这是 ember.js 最强大的品质之一。声明路由后，框架可以自动生成所有相应的控制器和视图（称为约定优于配置）。看一个例子

Ember.Application.create({});
Ember.Router.map(function(){
    this.route('panel1');
    this.route('panel2');
});


<script type="text/x-handlebars">
    {{link-to 'index' 'index'}}
    {{link-to 'first panel' 'panel1'}}
    {{link-to 'second panel' 'panel2'}}

    <!--your panels will be inserted automatically in the outlet property-->
    {{outlet}}
  </script>

  <script type="text/x-handlebars" data-template-name="panel1">
  panel 1
  </script>
  <script type="text/x-handlebars" data-template-name="panel2">
  panel 2
  </script>

演示：http: //jsbin.com/dekixayuxa/1/