将现有的Rails路由/应用迁移到Ember.js

Question

将现有的Rails路由/应用迁移到Ember.js

3

我正在尝试使用Ember.js在我的页面上渲染一些内容，以便不需要重新加载内容。

我遇到的问题是似乎什么都没有被渲染出来。

application.js

#= require jquery
#= require jquery_ujs
#= require jquery.ui.all
#= require date
#= require misc
#= require foundation
#= require handlebars
#= require ember
#= require ember-data
#= require_self


App = Ember.Application.create(
  LOG_TRANSITIONS: true
  ready: ->
    console.log "App ready"
    return
)
App.Router.map ->
  @resource "admin/pages",
    path: "/admin/pages"

  return

App.IndexRoute = Ember.Route.extend(redirect: ->
  @transitionTo "admin/pages"
  return
)
App.NewslinksRoute = Ember.Route.extend(model: ->
  App.Page.find()
)
DS.RESTAdapter.reopen namespace: "admin/pages"
App.Store = DS.Store.extend(revision: 13)
App.Page = DS.Model.extend(name: DS.attr("string"))

# for more details see: http://emberjs.com/guides/application/
#window.Grokphoto = Ember.Application.create()
$ ->
  $(document).foundation()
  return

routes.rb

match 'admin' => 'admin/pages#index'
  namespace :admin do
    resources :events, :only => :index
    resource :photographer, :only => [:edit, :update]
    resources :pages
    resources :posts
    resources :galleries
    resources :private_galleries do
      get :invite, :on => :member
      put :send_invite, :on => :member
    end
    resources :photos, :only => [:edit, :update, :destroy] do
      put 'sort', :on => :collection
    end
  end

然后在 /assets/javascripts/templates/admin/page/index.hbs 文件中，我有以下内容。

<!DOCTYPE html>
<html>
<head>
    <meta name="description" content="Ember - Latest" />
    <meta charset=utf-8 />
    <title>Ember</title>
    <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>Ember Works</h2>
</script>
</body>
</html>

如果我能够成功地呈现这个，那么我应该就能够解决剩下的问题了。

- Boss Nass

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Vysakh Sreenivasan · Accepted Answer

Emberjs和Rails简介

rails new app
cd app

# remove gem 'coffee-rails' from Gemfile if not needed

echo "gem 'ember-rails'" >> Gemfile
echo "gem 'ember-source', '1.3.0'" >> Gemfile
bundle
rails g ember:bootstrap
rails g controller home index
(Remove the lines in the view file)

# config/routes.rb
root 'home#index'

# config/environments/development.rb
echo "Hello world" >> app/assets/javascripts/templates/index.hbs

http://localhost:3000看这里 :)

Rails的正常流程

以下是在Rails中使用Emberjs的工作方式。emberjs只是一个能够进行路由（如 /#/posts）的JavaScript。

在Rails中，当请求发送到/admin时，会映射到'admin/pages#index'。此时，将执行以下操作：

进入特定的控制器操作。
呈现布局文件views/layouts/application.html.erb
然后在其中插入admin/pages#index视图。

使用Emberjs

当使用Emberjs时，同样会发生相同的事情，没有什么特别之处，也不会改变这个顺序，除了你不需要从admin/pages#index视图文件中呈现任何内容，它可以是空白的。

但你需要layouts/application.html.erb，因为你的所有JavaScript都在其下面。

<%= javascript_include_tag "application" %>

现在对于/admin的流程如下：

进入控制器操作。
渲染布局文件，该文件还包含涉及emberjs和handlebars的javascript代码。
呈现视图文件，该文件可以为空。因为emberjs将为我们插入编译后的handlebar模板。

要使emberjs在Rails中工作，需要：

您的布局文件需要使用应用程序.js加载javascript。
然后创建一个文件app/assets/javascripts/templates/index.hbs

Hello world

它应该能够正常工作！我建议您尝试创建新的Rails项目以获取一些想法，然后开始迁移。