为什么传递给视图时主干过滤器收集失败

Question

我有两种过滤集合的方法：

方法1：当我将它传递给视图时，使用此方法失败。

byCategory = @projects.byCategory(data)

方法二：这个方法效果很好。

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

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

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

当我将它传递给视图时，第二种方法有效。但是第一种方法失败了：

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

我的问题是：为什么？当我将它传递给视图时，为什么第一个失败，为什么第二个有效？第一个产生错误日志：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 的数组，而视图需要一个Backbone.Collection 的实例。在您看来，您可能正在使用this.collection.models 进行迭代*，而.models 是您肯定不会在Backbone.model 的普通数组中找到的属性。

* 如果您正在调用 collection.fetch() 或者甚至可能是 .set() 或任何其他 Backbone.Collection 方法，则该参数成立

---

我的直觉（除非你另有说明）是

App.Collections.Projects.byCategory()

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

问题一：为什么传递byCategory = @projects.byCategory(data)会失败？

因此，如果我的假设是正确的，那么 byCategory 变量只不过是 Backbone.model 的 JavaScript 数组。这不是 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() 中的混合相同的链接约定，并采用与_.map() 相同的Array 参数。因此，实际上，您很容易误以为您使用的是Backbone.collection.map()，而实际上您使用的是Array.prototype.map()。

问题依旧，为什么.get('title')方法在

console.log project.get('title')

工作？给上面的，很简单。由于您将Backone.model 的数组传递给Array.prototype.map()，因此每次迭代的参数都是Backone.model，它会很乐意接受Backone.model.get()。