使用“ember-rails”将路由从Rails迁移到Ember并使用现有的Rails应用程序

时间:2013-08-06 22:25:25

标签: javascript ruby-on-rails-3 ember.js

为现有的rails应用程序使用gem“ember-rails”。我正在尝试使用Ember路由一个资源,很多人都告诉我这个代码应该可以工作,但事实并非如此。

我希望突破学习曲线并使其发挥作用,但我需要一些帮助。

错误

Routing Error
No route matches [GET] "/newslinks"

代码

的application.js

//= require jquery
//= require jquery-ui
//= require jquery_ujs
//= require jquery-fileupload/basic
//= require jquery-fileupload/vendor/tmpl
//= require chosen-jquery
//= require bootstrap
//= require bootstrap-notify
//= require jquery.limit-1.2.source
//= require bootstrap-switch
//= require handlebars
//= require ember
//= require ember-data
//= require_self
//= require app

app.js

    App = Ember.Application.create({
  LOG_TRANSITIONS: true,
  ready: function() {
    console.log('App ready');
  }
});

App.Router.map(function() {
    this.resource('newslinks', { path: '/' });
});

App.IndexRoute = Ember.Route.extend({
  redirect: function() {
    this.transitionTo('newslinks');
  }
});

App.NewslinksRoute = Ember.Route.extend({
  model: function() {
  return App.Newslink.find();
  }
});

DS.RESTAdapter.reopen({
  namespace: 'api/v1'
});

App.Store = DS.Store.extend({
  revision: 13
});

App.Newslink = DS.Model.extend({
  name: DS.attr('string')
});

的routes.rb

namespace :api do
  namespace :v1 do
    resources :newslinks
  end
end

application.handlebars

    <!DOCTYPE html>
<html>
<head>
<meta name="description" content="Ember - Latest" />
<meta charset=utf-8 />
<title>Ember Latest</title>
<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0-rc1/css/bootstrap.min.css" rel="stylesheet">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0-rc1/js/bootstrap.min.js"></script>
  <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
  <script src="http://builds.emberjs.com/handlebars-1.0.0.js"></script>
  <script src="http://builds.emberjs.com/ember-latest.js"></script>
  <script src="http://builds.emberjs.com/ember-data-latest.js"></script>
</head>
<body>
  <script type="text/x-handlebars">
    <h2>Here I am</h2>
  </script>
</body>
</html>

结论

请告诉我你如何建议只设置一条路线:/ newslinks到Ember并使用现有的铁路路线进行渲染。

这与数据无关(只想使用ember呈现路径)。此外,这段代码在jsbin中工作,所以它也不是让Ember独立于轨道工作

我是否需要引导rails在routes.rb中呈现Ember路由?或者Ember路由是否位于铁路路线的顶部并且采摘它识别的路线?

1 个答案:

答案 0 :(得分:2)

如果您正在使用带有rest适配器的ember数据,则配置如下:

鉴于此URL your-host/api/v1/newslinks具有以下json结构:

{
  newslinks: [
    {id: 1, name: 'foo'},
    {id: 2, name: 'bar' }
  ]
}

您只需要映射新闻链接路由:

App.Router.map(function() {
    this.resource('newslinks', { path: '/' });
});

并在DS.RestAdapter中映射命名空间:

DS.RESTAdapter.reopen({
  namespace: 'api/v1'
});

Here是使用rest适配器并模拟响应的实时演示。

默认情况下,rails将为json提供没有json的根路径:

[
  {id: 1, name: 'foo'},
  {id: 2, name: 'bar' }
]

要轻松完成这项工作,只需在导轨控制器中将:json添加到render方法,然后再添加数据。因此rails将使用活动模型序列化程序,并且将存在根路径:

def index
  @users = User.all
  render json: @users
end

我希望它有所帮助。