0

我在我的 ember-rails 应用程序中创建了一个 Ember 组件，但由于某些深不可测的原因，它没有读取我的主要组件 js 文件。

我正在像这样使用我的组件..

# app/assets/javascripts/templates/comment.hbs

<p>{{time-ago createdAt=comment.created_at}}</p>

这是组件模板，我可以看到它正在渲染，因为我可以看到静态文本“已发布”显示在浏览器中，但组件 js 文件中定义的任何内容都只会输出空白，例如 {{doesNotWork}} 什么也不输出。

# app/assets/javascripts/tenmplates/components/time-ago.js

<p>posted <strong>{{timeAgo}} {{doesThisWork}}</strong></p>

并且似乎没有加载的组件 js 文件因为没有我在这里定义的变量，我似乎可以渲染到组件模板中

# app/assets/javascripts/components/time-ago.js

App.TimeAgoComponent = Ember.Component.extend({
  timeAgo: '',
  oldTimeAgo: '',
  doesThisWork: 'shows blank rather than this message',

  clock: function() {
    var newTimeAgo =  moment(this.get('createdAt')).fromNow();

    if (this.get('oldTimeAgo') !== newTimeAgo ) {
      this.set('timeAgo', moment(this.get('createdAt')).fromNow());
    }

    Ember.run.later(this, this.clock, 1000 * 10);
  }.on('didInsertElement') 
});

我的直觉是 ember-rails 如何渲染或不渲染 app/assets/javascripts/components 中的文件存在问题，有什么想法吗？

[编辑 1：根据评论查询添加我的 rails js 文件]

这是我的rails js文件。请注意，ember 应用程序位于我的 rails 应用程序中的路径 /docs 上。

# app/assets/javascripts/docs.js.coffee

#= require handlebars
#= require ember
#= require ember-data
#= require remarkable
#= require moment
#= require ember-devise-simple-auth/globals
#= require_tree ./templates
#= require_tree ./components
#= require_self
#= require app

# app/assets/javascripts/application.js.coffee

#= require jquery
#= require jquery_ujs
#= require jquery.timeago
#= require turbolinks
#= require bootstrap
#= require activities
#= require collaborators
#= require dashboard
#= require plans
#= require profiles
#= require projects
#= require roles
#= require sections
#= require templates
#= require subscriptions
#= require select2

[编辑 2：我想知道 app/javascripts/components 路径是否正在加载]

我在 rails 中发现我可以从 rails 控制台运行这个命令。

>> y Rails.application.config.assets.paths
---
- /Users/richie/Projects/bimbicycle/app/assets/images
- /Users/richie/Projects/bimbicycle/app/assets/javascripts
- /Users/richie/Projects/bimbicycle/app/assets/stylesheets
- /Users/richie/Projects/bimbicycle/vendor/assets/components
- /Users/richie/Projects/bimbicycle/vendor/assets/ember
- /Users/richie/Projects/bimbicycle/vendor/assets/fonts
- /Users/richie/Projects/bimbicycle/vendor/assets/images
- /Users/richie/Projects/bimbicycle/vendor/assets/javascripts
- /Users/richie/Projects/bimbicycle/vendor/assets/stylesheets
- /Users/richie/.rvm/gems/ruby-2.0.0-p481/gems/bootstrap-sass-3.1.1.0/vendor/assets/fonts
- /Users/richie/.rvm/gems/ruby-2.0.0-p481/gems/bootstrap-sass-3.1.1.0/vendor/assets/javascripts
- /Users/richie/.rvm/gems/ruby-2.0.0-p481/gems/bootstrap-sass-3.1.1.0/vendor/assets/stylesheets
- /Users/richie/.rvm/gems/ruby-2.0.0-p481/gems/font-awesome-sass-4.0.3.2/vendor/assets/fonts
- /Users/richie/.rvm/gems/ruby-2.0.0-p481/gems/font-awesome-sass-4.0.3.2/vendor/assets/stylesheets
- /Users/richie/.rvm/gems/ruby-2.0.0-p481/gems/xray-rails-0.1.14/app/assets/javascripts
- /Users/richie/.rvm/gems/ruby-2.0.0-p481/gems/xray-rails-0.1.14/app/assets/stylesheets
- /Users/richie/.rvm/gems/ruby-2.0.0-p481/gems/select2-rails-3.5.7/app/assets/images
- /Users/richie/.rvm/gems/ruby-2.0.0-p481/gems/select2-rails-3.5.7/app/assets/javascripts
- /Users/richie/.rvm/gems/ruby-2.0.0-p481/gems/select2-rails-3.5.7/app/assets/stylesheets
- /Users/richie/.rvm/gems/ruby-2.0.0-p481/gems/turbolinks-2.1.0/lib/assets/javascripts
- /Users/richie/.rvm/gems/ruby-2.0.0-p481/gems/jquery-rails-3.0.4/vendor/assets/javascripts
- /Users/richie/.rvm/gems/ruby-2.0.0-p481/gems/coffee-rails-4.0.1/lib/assets/javascripts
- !ruby/object:Pathname
  path: /Users/richie/Projects/bimbicycle/vendor/assets/components
=> nil

有趣的是注意到最后与供应商/资产/组件有关的错误，但我不确定这是否真的与我的问题有关，因为我的组件位于 app/assets/components 下。

想知道，是否有更好的 rails 推荐来检查 require_tree ./components 是否正在加载我的 time-ago.js 文件？

4

0 回答 0