1

現在、javascript の backbone.js ビューを coffeescript に変換していますが、正しく動作していません。

私の作業元のJavascriptビューは

define([
  'jquery',
  'underscore',
  'backbone',
  'text!templates/dashboard/main.html'
], function($, _, Backbone, mainHomeTemplate){

  var Test = Backbone.View.extend({
    el: $("#page"),
    render: function(){
      this.$el.html(mainHomeTemplate);
    }
  });
  return Test;
});

私のcoffeescriptビューは

define [
  'jquery',
  'underscore',
  'backbone',
  'text!templates/dashboard/main.html'
], ($, _, Backbone, mainHomeTemplate) ->

Test = Backbone.View.extend
    el: $ '#page'

    render: ->
        $(@el).html @mainHomeTemplate

Test

テストビューを初期化しようとすると、テストが未定義であると表示されます。

app_router.on('route:defaultAction', function (actions) {
      require(['views/dashboard/testnew'], function(Test) {
        console.log(Test)
        var test = new Test();
        test.render();
       });

どんな助けでも本当に感謝しています。ありがとう

4

1 に答える 1

3

単なるローカル変数の場合mainHomeTemplate、インスタンス変数 ( @mainHomeTemplate、 と同じもの) として参照しています。this.mainHomeTemplateあなたがしたい：

Test = Backbone.View.extend
    el: $ '#page'

    render: ->
        $(@el).html mainHomeTemplate # <-------- No '@' on 'mainHomeTemplate'

そして、私がここにいる間は、Backbone に jQuery の処理を​​任せるべきでelあり、あなたのビューは既に@$el(Backbone の最近のバージョンを使用していると仮定して) 処理する必要がないので、次のことを行う必要はありません$(@el)。

Test = Backbone.View.extend
    el: '#page'
    render: ->
        @$el.html mainHomeTemplate

関数にインデントがないのdefineは、単なるコピー/貼り付けエラーでもあると思います。CoffeeScript のインデントには細心の注意を払う必要があります。CoffeeScript のコードを質問に貼り付ける場合も同様です。の代わりに、通常の CoffeeScript クラス メカニズムを使用することもできますBackbone.View.extend。最終結果は次のようになります。

define [
  'jquery',
  'underscore',
  'backbone',
  'text!templates/dashboard/main.html'
], ($, _, Backbone, mainHomeTemplate) ->

    class Test extends Backbone.View
        el: '#page'

        render: ->
            @$el.html mainHomeTemplate

    Test
于 2012-11-05T19:46:22.740 に答える