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

vendor/assets/components に関連する最後のエラーに注意するのは興味深いことですが、コンポーネントが app/assets/components の下にあるため、これが私の問題に本当に関連しているかどうかはわかりません。

疑問に思っていますが、require_tree ./components が time-ago.js ファイルをロードしていることを確認するためのより良い Rails commend はありますか?

4

0 に答える 0