Question

基本上，在Backbone＆amp; coffeescript，我正在从Twitter API中提取推文。获取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"

非常感谢任何帮助，谢谢。

Answer 1

我认为问题在于你的成功处理程序中“this”（@ in coffeescript）的范围不是你的HomeView，而是“窗口”。因此'window.el'不存在。

简单的解决方案是使用'胖箭头'将事件处理程序的范围设置为视图：

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

这个jsFiddle显示了一个工作示例：http://jsfiddle.net/edwardmsmith/PwMSP/6/

获取数据时骨干模板/ html无法正常工作 - 用CoffeeScript编写

1 个答案: