javascript - 为什么主干过滤器收集在传递给 View 时失败

Question

我有两种方法来过滤集合:

方法1:当我将其传递给 View 时，使用此方法会失败。

byCategory = @projects.byCategory(data)

方法2:这个方法效果很好。

byCategory = new App.Collections.Projects(@projects.byCategory(data))

当我映射 byCategory 并获取标题时，这两种方法都有效:

byCategory.map (project) ->
  console.log project.get('title')

当我将其传递给 View 时，第二种方法有效。但第一种方法失败了:

view = new App.Views.ProjectsCarousel(collection: byCategory)
$('.slides').html(view.render().el);

我的问题是:为什么？为什么当我将它传递给 View 时第一个失败，为什么第二个有效？第一个生成错误日志:TypeError: _ref is undefined

完整代码:

路由器

class App.Routers.PortfolioRouter extends Backbone.Router
  routes:
    '': 'index'

  index: ->
    controls = new App.Views.ProjectsControls({el: '#list', projects: new App.Collections.Projects()});

收藏

class App.Collections.Projects extends Backbone.Collection
  url: '/de/projects'

  byCategory: (cat) ->
    return @where category: cat

观看次数

class App.Views.ProjectsControls extends Backbone.View

  events:
    'click a': 'selectCategory'

  initialize: (options) ->
    @projects = options.projects
    @projects.fetch()

  selectCategory: (event) ->
    event.preventDefault()

    data = $(event.currentTarget).attr('data-category')
    # This method fails when I pass it to the view
    # byCategory = @projects.byCategory(data)
    # This method works very well, why does it work and the previous no?
    byCategory = new App.Collections.Projects(@projects.byCategory(data))

    # it works with both methods
    byCategory.map (project) ->
      console.log project.get('title')

    view = new App.Views.ProjectsCarousel(collection: @projects)
    $('.slides').html(view.render().el);    



class App.Views.ProjectsCarousel extends Backbone.View
  template: JST['projects/carousel']

  render: ->
    @$el.html(@template(projects: @collection))
    this

模板

<% for project in @projects.models: %>
  <%= project.get('title') %>
<% end %>

Answer 1

TL;DR

我假设@projects.byCategory(data)返回 Backbone.model 的数组，而 View 需要 Backbone.Collection 的实例。在您看来，您可能正在使用 this.collection.models对于迭代*和 .models是一个在 Backbone.model 的普通数组中肯定找不到的属性。 .

* The argument holds true if you're calling collection.fetch() or maybe even .set(), or any other Backbone.Collection, method

<小时/>

我的直觉(除非你另有说明)是

App.Collections.Projects.byCategory()

返回 Backnone.model 的数组，可能通过 .map()或.pluck() 。这个假设将回答您的问题并满足您的 .map()测试。

问题1:为什么会通过byCategory = @projects.byCategory(data)失败？

所以如果我的假设是正确的，那么byCategory变量只不过是一个 JavaScript 数组 Backbone.model 。这不是 Backbone 在使用 Backbone.View.collection 时所期望的。属性，例如当您执行 fetch 时，或set或者只是尝试迭代 collection.models (一个简单的 model 数组不带有 .models 属性)。

问题 2:为什么 .map()总是工作吗？

这个问题的答案并不明显。显然Backbone.collection.map自 _.map() 起将顺利工作混合成Backbone.Collection默认情况下。

原因.map()适用于 byCategory === @projects.byCategory(data)取决于两件事。 1.byCategory因此，是一个数组，我假设您使用的是 ECMASCRIPT 5 兼容的浏览器，Array.prototype.map()作品。它接受与 _.map() 中的混合相同的链接约定。并采取相同的 Array参数为_.map() 。因此，实际上，您很容易被愚弄，认为您正在使用 Backbone.collection.map() ，而实际上您正在使用 Array.prototype.map() .

问题仍然存在，为什么.get('title')方法在

console.log project.get('title')

工作？给出上面的，就简单了。由于您传入了 Backone.model 的数组至Array.prototype.map() ，每次迭代中的参数为 Backone.model ，它会很乐意接受 Backone.model.get() .