我有以下下拉菜单:
{{view SettingsApp.Select2SelectView
id="country-id"
contentBinding=currentCountries
optionValuePath="content.code"
optionLabelPath="content.withFlag"
selectionBinding=selectedCountry
prompt="Select a country ..."}}
...
{{view SettingsApp.Select2SelectView
id="city-id"
contentBinding=currentCities
selectionBinding=selectedCity
prompt="Select a city ..."}}
绑定属性在控制器中定义:
SettingsApp.ServicesEditController = SettingsApp.BaseEditController.extend(SettingsApp.ServicesMixin, {
needs : ['servicesIndex'],
selectedCountry : null,
selectedCity : null,
currentCountries : null,
currentCities : null,
init : function () {
this._super();
},
setupController : function (entry) {
this._super(entry);
var locator = SettingsApp.locators.getLocator(this.get('content.properties.locator'));
var countryCode = locator.get('country'), city = locator.get('city');
this.set('currentCountries', SettingsApp.countries.getCountries());
this.set('currentCities', SettingsApp.locators.getCities(countryCode));
this.set('selectedCountry', SettingsApp.countries.getCountry(countryCode));
this.set('selectedCity', city);
// Add observers now, once everything is setup
this.addObserver('selectedCountry', this.selectedCountryChanged);
},
selectedCountryChanged: function () {
var countryCode = this.get('selectedCountry.code');
var currentCities = SettingsApp.locators.getCities(countryCode);
var selectedCity = currentCities[0];
this.set('currentCities', currentCities);
this.set('selectedCity', selectedCity);
},
...
});
初始设置工作正常,但更改国家/地区选择不会更新下拉菜单中的城市选择,即使selectedCountryChanged
调用了观察者 ( ) 并且this.set('selectedCity', selectedCity);
按预期工作(如控制台日志中所示)。在currentCities
观察者运行后正确设置,但活动(选定)值不正确(保持不变)。
在这种情况下,绑定属性的编程更新是否存在任何已知问题selectionBinding
?
我Select2SelectView
的是:
SettingsApp.Select2SelectView = Ember.Select.extend({
prompt: 'Please select...',
classNames: ['input-xlarge'],
didInsertElement: function() {
Ember.run.scheduleOnce('afterRender', this, 'processChildElements');
},
processChildElements: function() {
this.$().select2({
// do here any configuration of the
// select2 component
escapeMarkup: function (m) { return m; } // we do not want to escape markup since we are displaying html in results
});
},
willDestroyElement: function () {
this.$().select2('destroy');
}
});