Question

我这里有这个代码：

App.SearchController = Ember.ObjectController.extend({
selectedCabinet: null,
selectedTabs: null,

selectCabinetData: function() {
    return this.store.find('cabinets')
}.property('@each.cabinets') ,

actions: {
    searchFiles: null,
},
selectedCabinetChanged: function() {
    console.log(this.selectedCabinet.id)
    if (this.selectedCabinet){
        return this.store.find("tabs", {cabinet: this.selectedCabinet.id})
    }else{
        return null;
    }
}.observes('selectedCabinet')
});

我可以看到ajax请求并过滤，但它不会更新此处的选择框

{{查看Ember.Select contentBinding = selectCabinetChanged selectionBinding = “selectedTabs” optionValuePath = “content.id” optionLabelPath = “content.tab_name” prompt =“选择标签”}}

基本上基于第一个选择框的值将决定另一个选择框的结果。

我错过了一些简单的东西吗？

Answer 1

this.store.find("tabs", { ... })返回一个promise而不是数组，因此您需要创建一个filteredTabs属性并使用已解析的promise中的结果设置该值：

App.SearchController = Ember.ObjectController.extend({
    selectedCabinet: null,
    selectedTabs: null,
    filteredTabs: null,
    selectCabinetData: function(){
        return this.store.find('cabinets')
    }.property('@each.cabinets'),
    actions: {
        searchFiles: null,
    },
    selectedCabinetChanged: function() {
        var controller = this;        
        if(this.get('selectedCabinet')){
            this.store.find("tabs", { cabinet: this.get("selectedCabinet.id") }).then(function(filteredTabs) {
                controller.set('filteredTabs', filteredTabs);
            });
        } else {
            controller.set('filteredTabs', null);
        }
    }.observes('selectedCabinet')
});

将您的contentBinding=selectCabinetChanged更新为contentBinding=filteredTabs，如下所示：

{{view Ember.Select contentBinding=filteredTabs selectionBinding="selectedTabs" optionValuePath="content.id" optionLabelPath="content.tab_name" prompt="Select A Tab"}}

在另一个选择框更改后更新选择框

1 个答案: