Question

我有一个导航服务，期望每个路线定义导航将显示的项目。导航的可见部分，导航的隐藏部分。当用户点击菜单图标时，隐藏部分会显示出来。可见的显示在页面底部的导航栏中

在路线中我传递了类似的导航项

this.get('navigationService').set('navigationMenuItems',[
    Ember.Object.create({
        icon: "user",
        size: "(totalSpace / 2)"
    }),
    Ember.Object.create({
        icon: "items",
        size: "(totalSpace / 2)"
    }),
    Ember.Object.create({
        icon: "my-items",
        size: 60
    }),
    Ember.Object.create({
        icon: "event",
        size: 60
    }),
    Ember.Object.create({
        icon: "ticket",
        size: 60
    }),
    Ember.Object.create({
        icon: "cart",
        size: 60
    }),
    Ember.Object.create({
        icon: "donate",
        size: 60
    }),
]);

在我的navigationService我使用这个数组来构建两个新数组，一个是可见的，一个是看不见的

navigationMenuItems: [],
visibleNavItems: [],
hiddenNavItems: [],
_initializeNavigation: Ember.observer('navigationMenuItems',function(){
    var self = this;
    self.get('visibleNavItems').clear();
    self.get('hiddenNavItems').clear();
    var items = self.get('navigationMenuItems').toArray();
    var totalSpace = Ember.$(window).innerWidth() - 60;
    var availableSpace = totalSpace;
    items.forEach(function(item){
      var width = eval(item.size);
      if(width <= availableSpace) {
        availableSpace -= width;
        self.get('visibleNavItems').pushObject(item);
      }else{
        self.get('hiddenNavItems').pushObject(item);
      }
    })
})

我迭代了一个项目的副本（我试图删除这些项目并将它们推入新的数组中）并检查它们指定的大小是否适合可用空间，如果是的话我将它推入进入可见项目，更新新的可用空间并继续前进。

我真正想要做的是停止第一个不合适的项目，而不是继续迭代其余项目，将所有其余项目推入隐藏项目数组并停止循环。 / p>

我在从初始数组中删除项目并将它们推送到正确的数组时遇到了一些问题，所以现在这个工作正常，但我觉得它可以更好，更有效地完成。

有人可以帮助我将这个项目从复制的数组移动到新数组中，以便在else我可以假设我将剩下的数据推入隐藏数组并停止循环吗？ / p>

Answer 1

使用any方法，该方法与数组的内置some方法相同。只有在返回false时，此循环才会执行。你回来的那一刻就停止了。

以下是您修改后的代码和 here it is working 。检查控制台。

navigationMenuItems.any(function(item, index){     
     var width = eval(item.size);
     console.log(item, width, availableSpace);
      if(width <= availableSpace) {
        availableSpace -= width;
        visibleNavItems.pushObject(item);
        return false;
      }else{
        hiddenNavItems.pushObjects(navigationMenuItems.slice(index));
        return true;
      }
});

console.log(visibleNavItems.toArray(), hiddenNavItems.toArray());

Ember将对象从一个阵列移动到另一个阵列

1 个答案: