Question

我想将模型中的所有isSelected属性重置为false（请参阅下面的模型）

import Ember from 'ember';

export default Ember.Route.extend({
    model() {
        return [
            {
                src: 'assets/images/sample-image0.jpg',
                isInspected: false,
                isSelected: true
            },
            {
                src: 'assets/images/sample-image0.jpg',
                isInspected: true,
                isSelected: false
            }
        ];
    }
});

组件side-bar，

{{app/side-bar
    images=model
}}

在我的组件中，我尝试重置模型数组中每个对象的选定状态使用下面的代码（这是设置值的最佳做法吗？）

import Ember from 'ember';

export default Ember.Component.extend({
    classNames: ['side-bar'],

    actions: {
        imageClicked() {
            this._resetSelectionHighlight();
        }
    },

    _resetSelectionHighlight() {
        const images = this.get('images');

        images.forEach((img) => {
            Ember.set(img, 'isSelected', false);
        });

        console.log(this.get('images'));
    }
});

我的问题

在Ember中迭代设置值的正确方法是什么？

Answer 1

你的方法非常好。

但是，Ember已经在您可以使用的setEach类上定义了一个方法MutableEnumerable。

import Ember from 'ember';

export default Ember.Component.extend({
    // ...

    _resetSelectionHighlight() {
        this.get('images').setEach('isSelected', false); // Note: images must inherit Ember.MutableEnumerable
    }
});

另一种适用于任何数组的更通用的方法是创建一个帮助程序来为您完成此任务。

// utils/set-array-prop.js
export default function setArrayProp(arr, prop, value) {
  arr.forEach((item) => Ember.set(item, prop, value));
}

然后您可以在代码中使用它，如：

import Ember from 'ember';
import setArrayProp from 'my-app/utils/set-array-prop';

export default Ember.Component.extend({
    // ...

    _resetSelectionHighlight() {
        setArrayProp(
          this.get('images'), // now images can be a regular array of objects
          'isSelected',
          false
        );
    }
});

如何迭代设置数组属性中每个元素的值？

1 个答案: