2

我知道这是一个广泛的问题，但我没有找到具体的答案，现在我觉得我只需要采取霰弹枪的方法。

我正在尝试在 rails 应用程序中加载 ember 应用程序。我有 ember_controller.rb：

class EmberController < FrontendController
  layout 'ember'
  def load
  end
end

我的 Rails 路线如下所示：

MdmFrontEnd::Application.routes.draw do

  resources :sessions, only: [:create, :new, :destroy]

  match '/signin', to: 'sessions#new'
  match '/signout', to: 'sessions#destroy', via: :delete
  match '*path' => 'ember#load'
  root to: 'ember#load' #makes the root of the app, the ember root.
end

我的导轨布局如下所示：

!!! 5
%html
  %head
    %meta{charset:"utf-8"}
    %title= t("layouts.mobile_manager")
    %meta{name:"viewport", content:"width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0" }
    %link{rel: "icon", type:"image/png", href:"/assets/favicon_16x16.png"}
    = javascript_include_tag "i18n"
    :javascript
      window.locale = "<%= I18n.locale %>";
    = stylesheet_link_tag 'application', media: 'all' 
    = csrf_meta_tags 
    <!--[if lt IE 9]>
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->

    -if Rails.env.production? 
      :javascript
        var _gaq = _gaq || [];
        _gaq.push(['_setAccount', 'UA-33246783-1']);
        _gaq.push(['_trackPageview']);
        (function() {
          var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
          ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
          var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
        })();
    = render 'shared/js_constants'
    = javascript_include_tag 'app_ember'
  %body

我正在 app_ember.coffee 中使用以下内容初始化一个新的 ember 应用程序：

#= require jquery
#= require jquery_ujs
#= require handlebars
#= require ember
#= require_self
#= require_tree ./app/routes
#= require_tree ./app/controllers
#= require_tree ./app/models
#= require_tree ./app/templates
#= require_tree ./app/views

window.Mdm = Ember.Application.createWithMixins
  LOG_TRANSITIONS: true

  ajax: ->
  $.ajax.apply(this, arguments)

  getUrl: (path) ->
    "/#{path}"

然后我有我的模板，application.hbs 和 index.hbs，在应用程序内部有一个 {{outlet}}。

但是当我尝试渲染根时，我只是得到一个空白屏幕。

我知道它会看到模板，因为在控制台中，当我运行 Ember.TEMPLATES 时，它会列出每个模板对象。

我觉得这是 b/t rails 和 ember 的问题，但我不知道。

感谢您的任何想法！

编辑:: 我的控制台

在此处输入图像描述

如您所见，它正在加载我的模板对象，但它也说它找不到应用程序或索引模板。我的模板目录的命名和位置与其他目录一样 - 模型、控制器等。

4

1 回答 1

1

这里发生了很多事情，很难确定。一些需要考虑的事情

  1. 如果您的 ember 应用程序已正常启动，您应该会看到一些 console.log 输出。这将包括来自 ember re 的 DEBUG 信息：加载了哪些版本。如果您没有看到，则说明您的环境有问题。

  2. 既然你已经设置了LOG_TRANSITION: true，你应该会看到 console.log 消息，比如：Transitioned into 'post.index'当路由器转换到当前路由时。如果页面加载时您在控制台中没有看到任何这些消息，则应用程序未正确启动。

  3. 通常，当我遇到此类问题时，是因为我的命名约定与 ember 的预期不符。结果，我的代码被忽略了，ember 正在使用生成的默认值。要查看幕后发生的事情，请在创建应用程序时再设置两个属性：

-

LOG_ACTIVE_GENERATION: true,
LOG_VIEW_LOOKUPS: true

有了这个，每当 ember 生成 Route/Controller 或呈现视图时，您应该会看到 console.log 输出。完成所有这些后，您的 console.log 应该如下所示：

DEBUG: -------------------------------
DEBUG: Ember.VERSION : 1.0.0-rc.4 
DEBUG: Handlebars.VERSION : 1.0.0-rc.4
DEBUG: jQuery.VERSION : 1.8.3
DEBUG: ------------------------------- 
generated -> route:post.index Object {fullName: "route:post.index"}
Rendering application with <App.ApplicationView:ember785> Object {fullName: "view:application"} 
Rendering post with <App.PostView:ember789> Object {fullName: "view:post"} 
generated -> controller:post.index Object {fullName: "controller:post.index"} 
Rendering post.index with default view <Ember._MetamorphView:ember796> Object {fullName: "view:post.index"}
Transitioned into 'post.index'

在这里，您可以看到正在生成哪些类、正在呈现哪些模板以及正在使用哪些视图类。

于 2013-06-12T23:23:54.053 回答