javascript - 以优雅的方式根据模型的属性迭代 Backbone 集合

标签 javascript backbone.js

我有一个主干集合,并且基于集合内模型的属性,我迭代该集合并将其显示在 UI 中。

逻辑是,如果模型的属性 isNewCartrue,我将首先在 UI 中显示它们,然后是分隔符,然后我将显示所有属性 isNewCarfalse 的模型。

this.cars.forEach(function (car, index) 
{
    if(car.isNewCar()){ //IF A NEW CAR
        //some logic.
        //Attach current view in DOM with this model's properties           
    }   
});

//Here, Attach some separator in DOM

this.cars.forEach(function (car, index) 
{
    if(!car.isNewCar()){ //IF 'NOT' A NEW CAR
        //some logic.
        //Attach current view in DOM with this model's properties           
    }
}); 

这看起来很困惑,我知道它不太优雅,有人可以建议一种更好的方法来用一些优雅的解决方案替换上面的代码吗?

最佳答案

我建议使用通用的渲染逻辑来在单独的函数中渲染项目,例如 renderCars() 并按如下方式过滤集合

 function filterCars(isNew) {
   var isNewCar = isNew
   return function(car) {
      return (car.isNewCar() === isNewCar);
   }
 }

 renderCars (this.cars.filter(filterCars(true)) );
 renderCars (this.cars.filter(filterCars(false)) );

我们上面所做的只是创建了一个辅助函数filterCars,它使用一个 bool 值来决定我们是否需要新车。该辅助函数返回一个用于过滤汽车的函数。

主干过滤器使用下划线过滤器返回过滤结果的新数组。我将其传递给通用渲染函数。

我没有对此进行测试,但这应该有助于清除一些重复的代码。

关于javascript - 以优雅的方式根据模型的属性迭代 Backbone 集合,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30522727/

相关文章:

javascript - 工作完成后 RelationalModel 关系字段为 NULL

javascript - “请求 header 字段不允许授权”错误 - Tastypie

javascript - Javascript 中的现场声音合成 : any way to reduce latency?

javascript - 当两个数据属性都不为空时,将按钮从禁用更改为启用

c# - 服务器无法识别 HTTP header SOAPAction 的值

JavaScript/jQuery - 数组列表没有遍历整个板

javascript - 根据选择选项更改属性

javascript - Backbone.js 设置 View 属性

javascript - Backbone Tempting with Underscore 正在渲染模板中的一个属性,但不渲染另一个属性

backbone.js - 以静默方式将单元格添加到 JointJS 图形