视图

Question

我无法将一个选择框绑定到另一个选择框。我想在一个选择框中的选项取决于在另一个选择框中选择的内容。在这种情况下，我想根据第一个选择框中的内容填充第二个选择框的内容。我对Ember很陌生，所以我正在寻找一些关于采取何种方法的指导。我尝试过使用计算属性，但这并不成功。我是否需要使用观察者来监控第一个选择框中的更改？

视图

<script type="text/x-handlebars" data-template-name="lookup">

<h1 style="padding: 0; margin: 0 0 15px 0;"> Lookup </h1> 

<label for="DEName">Data Extension</label>
{{view "select" contentBinding='content' id="DEName" optionLabelPath="content.name" optionValuePath="content.name" selectionBinding=lookupDE}}

<div class='multi_column_section'> 
    <div class='inlineInput'> 
        <label class='inlineLabel' for='filter_column'>Filter Column </label> 
        {{view "select"  contentBinding=adjustFilter}}
    </div> <!-- 
    --><div class='inlineInput'> &nbsp; = &nbsp; </div> <!-- 
    --> <div class='inlineInput'> 
            <label class='inlineLabel' for='filter_value'>Filter Value </label> 
            <input type='text' class='nj_textBox' id='filter_value' name='filter_value'> 
        </div> 
</div>

<a href="#" {{action 'formString'}} class="generate_btn">Generate</a>

</script>
#Lookup Controller
App.LookupController = Ember.ObjectController.extend({

content:[
    {
        name: "Customers", fields:["first_name", "last_name", "address", "email"]
    }, 
    {
        name: "Products", fields:["sku", "name"]
    }, 
    {
        name:"Sales", fields:["product_sku", "sales_rep", "customer_id", "transaction_id", "date"]
    }
],  
lookupDE:"Sales", 
adjustFilter: function(){
    var myContent = this.get("content"); 
    for(i=0; i<myContent.length; i++){
        if(myContent[i].name == this.lookupDE){
            return myContent[i].fields; 
        }
    }

        console.log(this.lookupDE);
        // console.log(this.names[i].name); 

    //return ["first_name", "last_name", "address", "email"];
}.property(), 
actions: {
formString: function(){
    //console.log(this.lookupDE); 
    var outputString = '%%[Lookup("'+this.lookupDE+'")]%%';
    $("#output").text(outputString);    
}

}，
}）;

Answer 1

在Ember中，这很容易。从概念上讲，您为第二个选择框的数据创建一个计算属性，该属性取决于第一个选择框的选择。这可以使用.property('selectionOfFirstSelect')表示法来创建计算的依赖属性。

这是一个您可能想要检查的实现：

https://gist.github.com/dgroch/11126341

content绑定Ember中的两个选择框

视图

1 个答案: