0

基本的に、Backbone＆coffeescriptでは、TwitterAPIからツイートを取得しています。JSONのフェッチは機能しますが、テンプレートをhtmlにロードすることはできません。テンプレートのプルインはrender関数内では機能しますが、@ Tweets.fetch（）関数内では機能しません。

失敗しているように見えるコード行は..

$(@.el).html(_.template($('#leTweets').html(), {tweets: tweets.models, _:_} ))

私の見解はこのように見えます...

class HomeView extends Backbone.View
        constructor: ->
            super

        initialize: ->
            @Tweets= new TweetsCollection

        render: ->
            @loadResults()

        loadResults: ->
            @Tweets.fetch({
                success: (tweets) ->
                    $(@.el).html(_.template($('#leTweets').html(), {tweets: tweets.models, _:_} ))
                error: ->
                    alert('Error!')
            })

私のHTMLは次のようになります。

<script type="text/template" id="leTweets">

    <div data-role="header" data-position="fixed">
        <h1>TWEETS</h1>
    </div>

    <div data-role="content">
        <h3>Tweets</h3>
        <ul class="tweets">
        <% _.each(tweets, function (tweet) { %>

          <li><%= tweet.get('text') %></li> 

        <% }); %>
        </ul>
    </div>

</script>

そして私のコレクションは次のようになります：

class PropertyCollection extends Backbone.Collection

    constructor: ->
        super

    url: ->
        'http://search.twitter.com/search.json?q=' + @query + '&page=' + @page + '&callback=?'

    parse: (resp, xhr) ->
        resp.results

    page: 1,
    query: "Backbone"

どんな助けでも大歓迎です、ありがとう。

4

1 に答える 1

2

問題は、成功ハンドラーの「this」(coffeescript の @) のスコープが HomeView ではなく、「window」であることだと思います。したがって、「window.el」は存在しません。

簡単な解決策は、「太い矢印」を使用して、イベント ハンドラーのスコープをビューに設定することです。

  success: (tweets) =>
      $(@.el).html(_.template($('#leTweets').html(), {tweets: tweets.models, _:_} ))

この jsFiddle は実際の例を示しています: http://jsfiddle.net/edwardmsmith/PwMSP/6/

于 2012-08-14T10:26:08.513 に答える