灰烬数组选项，使用灰烬电源选择(Ember array option with ember power select)

灰烬数组选项，使用灰烬电源选择(Ember array option with ember power select)

我的模型有两个属性（ baseCurrency和其他otherCurrencies ），其值通过2个余烬选择下拉菜单的形式选择，其选项取决于2个计算属性（ baseCurrencyOptions和otherCurrencyOptions ）

调节器

... otherCurrencyOptions: Ember.computed('model.baseCurrency', function() { console.log(`allCurrencies changed to: ${this.get('allCurrencies')}`); return Ember.A(this.get('allCurrencies')).removeObject(this.get('model.baseCurrency')); }), baseCurrencyOptions: Ember.computed('model.otherCurrencies', function() { console.log(`allCurrencies changed to: ${this.get('allCurrencies')}`); return Ember.A(this.get('allCurrencies')).removeObjects(this.get('model.otherCurrencies')); }) ...

allCurrencies属性包含所有货币的列表，它不应随时间而改变。

模板

{{#power-select searchEnabled=true options=baseCurrencyOptions selected=model.baseCurrency onchange=(action (mut model.baseCurrency) as |currency|}} {{currency}} {{/power-select}} {{#power-select-multiple searchEnabled=true options=otherCurrencyOptions selected=model.otherCurrencies onchange=(action (mut model.otherCurrencies)) as |currency|}} {{currency}} {{/power-select-multiple}}

问题在于，每次我在两个下拉菜单中的一个或另一个中选择货币时， allCurrencies属性都会以不可兑换的方式丢失每个选定货币。 我期望Ember.A()创建一个全新的对象，而无需修改`allCurrencies !. 此外，我得到以下警告：

DEPRECATION：您在一次渲染中修改了两次连接的触发器类。 这在Ember 1.x中不可靠，并且会在Ember 3.0中被删除[deprecation id：ember-views.render-double-modify]

My model has 2 attributes (baseCurrency and otherCurrencies) whose values are selected in a form by 2 ember power selects dropdown menu whose options depend on 2 computed properties (baseCurrencyOptions and otherCurrencyOptions)

controller

... otherCurrencyOptions: Ember.computed('model.baseCurrency', function() { console.log(`allCurrencies changed to: ${this.get('allCurrencies')}`); return Ember.A(this.get('allCurrencies')).removeObject(this.get('model.baseCurrency')); }), baseCurrencyOptions: Ember.computed('model.otherCurrencies', function() { console.log(`allCurrencies changed to: ${this.get('allCurrencies')}`); return Ember.A(this.get('allCurrencies')).removeObjects(this.get('model.otherCurrencies')); }) ...

allCurrencies property contains a list of all currencies and it is not supposed to change over time.

template

{{#power-select searchEnabled=true options=baseCurrencyOptions selected=model.baseCurrency onchange=(action (mut model.baseCurrency) as |currency|}} {{currency}} {{/power-select}} {{#power-select-multiple searchEnabled=true options=otherCurrencyOptions selected=model.otherCurrencies onchange=(action (mut model.otherCurrencies)) as |currency|}} {{currency}} {{/power-select-multiple}}

Problem is that every time I select a currency in one or the other of both dropdown menus allCurrencies property gets updated loosing in an irreversibile manner every selected currency. I expected Ember.A() to create a brand new object without modifying `allCurrencies!. Moreover I got the following warning:

DEPRECATION: You modified concatenatedTriggerClasses twice in a single render. This was unreliable in Ember 1.x and will be removed in Ember 3.0 [deprecation id: ember-views.render-double-modify]

最满意答案

Ember.A不会创建全新的Array它只会实现Ember.Enumerables和数组接口（ 引用 ）。

这是我的建议选项，

1）要创建全新的数组，可以使用toArray方法。 所以把这个Ember.A(this.get('allCurrencies'))改为this.get('allCurrencies').toArray()

2）另一种选择是，使用forEach迭代allCurrencies，并在内部回调中使用iterate baseCurrency来检查条件并填充其他货币数组。

var baseCurreny = this.get('model.baseCurrency'); var otherCurrency = []; this.get('allCurrencies').forEach(function(item, index, self) { /*I assume id as your unique property to identify object if (!baseCurrency.findBy('id', item.id)) { otherCurrency.pushObject(item); }*/ //or if its plain string then baseCurrency.forEach(function(baseItem) { if (item !== baseItem) { otherCurrency.pushObject(item); } }); }); 定义货币对象数组，例如[{id:1,name:'Dollar',type:'base'},{id:2,name:'Yen',type:'other'}]以便您可以使用计算宏获得基础baseCurrencies和其他otherCurrencies baseCurrencies:Ember.computed.filterBy('allCurrencies','type','base') otherCurrencies:Ember.computed.filterBy('allCurrencies','type','other')

Ember.A will not create brand new Arrayit will just implements Ember.Enumerables and array interfaces(reference).

Here is my suggested options,

1)To create brand new Array, you can use toArray method. so change this Ember.A(this.get('allCurrencies')) to this.get('allCurrencies').toArray()

2)Another option is, iterate allCurrencies using forEach and inside callback use iterate baseCurrency to check for the condition and fill otherCurrency Array.

var baseCurreny = this.get('model.baseCurrency'); var otherCurrency = []; this.get('allCurrencies').forEach(function(item, index, self) { /*I assume id as your unique property to identify object if (!baseCurrency.findBy('id', item.id)) { otherCurrency.pushObject(item); }*/ //or if its plain string then baseCurrency.forEach(function(baseItem) { if (item !== baseItem) { otherCurrency.pushObject(item); } }); }); Define Array of Currency object like [{id:1,name:'Dollar',type:'base'},{id:2,name:'Yen',type:'other'}] so that you can use computed macros to get baseCurrencies and otherCurrencies baseCurrencies:Ember.computed.filterBy('allCurrencies','type','base') otherCurrencies:Ember.computed.filterBy('allCurrencies','type','other')灰烬数组选项，使用灰烬电源选择(Ember array option with ember power select)

我的模型有两个属性（ baseCurrency和其他otherCurrencies ），其值通过2个余烬选择下拉菜单的形式选择，其选项取决于2个计算属性（ baseCurrencyOptions和otherCurrencyOptions ）

调节器

... otherCurrencyOptions: Ember.computed('model.baseCurrency', function() { console.log(`allCurrencies changed to: ${this.get('allCurrencies')}`); return Ember.A(this.get('allCurrencies')).removeObject(this.get('model.baseCurrency')); }), baseCurrencyOptions: Ember.computed('model.otherCurrencies', function() { console.log(`allCurrencies changed to: ${this.get('allCurrencies')}`); return Ember.A(this.get('allCurrencies')).removeObjects(this.get('model.otherCurrencies')); }) ...

allCurrencies属性包含所有货币的列表，它不应随时间而改变。

模板

{{#power-select searchEnabled=true options=baseCurrencyOptions selected=model.baseCurrency onchange=(action (mut model.baseCurrency) as |currency|}} {{currency}} {{/power-select}} {{#power-select-multiple searchEnabled=true options=otherCurrencyOptions selected=model.otherCurrencies onchange=(action (mut model.otherCurrencies)) as |currency|}} {{currency}} {{/power-select-multiple}}

问题在于，每次我在两个下拉菜单中的一个或另一个中选择货币时， allCurrencies属性都会以不可兑换的方式丢失每个选定货币。 我期望Ember.A()创建一个全新的对象，而无需修改`allCurrencies !. 此外，我得到以下警告：

DEPRECATION：您在一次渲染中修改了两次连接的触发器类。 这在Ember 1.x中不可靠，并且会在Ember 3.0中被删除[deprecation id：ember-views.render-double-modify]

My model has 2 attributes (baseCurrency and otherCurrencies) whose values are selected in a form by 2 ember power selects dropdown menu whose options depend on 2 computed properties (baseCurrencyOptions and otherCurrencyOptions)

controller

... otherCurrencyOptions: Ember.computed('model.baseCurrency', function() { console.log(`allCurrencies changed to: ${this.get('allCurrencies')}`); return Ember.A(this.get('allCurrencies')).removeObject(this.get('model.baseCurrency')); }), baseCurrencyOptions: Ember.computed('model.otherCurrencies', function() { console.log(`allCurrencies changed to: ${this.get('allCurrencies')}`); return Ember.A(this.get('allCurrencies')).removeObjects(this.get('model.otherCurrencies')); }) ...

allCurrencies property contains a list of all currencies and it is not supposed to change over time.

template

{{#power-select searchEnabled=true options=baseCurrencyOptions selected=model.baseCurrency onchange=(action (mut model.baseCurrency) as |currency|}} {{currency}} {{/power-select}} {{#power-select-multiple searchEnabled=true options=otherCurrencyOptions selected=model.otherCurrencies onchange=(action (mut model.otherCurrencies)) as |currency|}} {{currency}} {{/power-select-multiple}}

Problem is that every time I select a currency in one or the other of both dropdown menus allCurrencies property gets updated loosing in an irreversibile manner every selected currency. I expected Ember.A() to create a brand new object without modifying `allCurrencies!. Moreover I got the following warning:

DEPRECATION: You modified concatenatedTriggerClasses twice in a single render. This was unreliable in Ember 1.x and will be removed in Ember 3.0 [deprecation id: ember-views.render-double-modify]

最满意答案

Ember.A不会创建全新的Array它只会实现Ember.Enumerables和数组接口（ 引用 ）。

这是我的建议选项，

1）要创建全新的数组，可以使用toArray方法。 所以把这个Ember.A(this.get('allCurrencies'))改为this.get('allCurrencies').toArray()

2）另一种选择是，使用forEach迭代allCurrencies，并在内部回调中使用iterate baseCurrency来检查条件并填充其他货币数组。

var baseCurreny = this.get('model.baseCurrency'); var otherCurrency = []; this.get('allCurrencies').forEach(function(item, index, self) { /*I assume id as your unique property to identify object if (!baseCurrency.findBy('id', item.id)) { otherCurrency.pushObject(item); }*/ //or if its plain string then baseCurrency.forEach(function(baseItem) { if (item !== baseItem) { otherCurrency.pushObject(item); } }); }); 定义货币对象数组，例如[{id:1,name:'Dollar',type:'base'},{id:2,name:'Yen',type:'other'}]以便您可以使用计算宏获得基础baseCurrencies和其他otherCurrencies baseCurrencies:Ember.computed.filterBy('allCurrencies','type','base') otherCurrencies:Ember.computed.filterBy('allCurrencies','type','other')

Ember.A will not create brand new Arrayit will just implements Ember.Enumerables and array interfaces(reference).

Here is my suggested options,

1)To create brand new Array, you can use toArray method. so change this Ember.A(this.get('allCurrencies')) to this.get('allCurrencies').toArray()

2)Another option is, iterate allCurrencies using forEach and inside callback use iterate baseCurrency to check for the condition and fill otherCurrency Array.

var baseCurreny = this.get('model.baseCurrency'); var otherCurrency = []; this.get('allCurrencies').forEach(function(item, index, self) { /*I assume id as your unique property to identify object if (!baseCurrency.findBy('id', item.id)) { otherCurrency.pushObject(item); }*/ //or if its plain string then baseCurrency.forEach(function(baseItem) { if (item !== baseItem) { otherCurrency.pushObject(item); } }); }); Define Array of Currency object like [{id:1,name:'Dollar',type:'base'},{id:2,name:'Yen',type:'other'}] so that you can use computed macros to get baseCurrencies and otherCurrencies baseCurrencies:Ember.computed.filterBy('allCurrencies','type','base') otherCurrencies:Ember.computed.filterBy('allCurrencies','type','other')