简体   繁体   English

AngularJS 默认下拉选择不起作用

[英]AngularJS default dropdown select not working

var jsonData ='[
     {"type":"product",
      "id":1,"label":"Color",
      "placeholder":"Select Jean Color",
      "description":"",
      "defaultValue":"Brown",
      "choices":[{
         "text":"Denim",
         "price":"$0.00",
         "isSelected":"false"
      },
      {
        "text":"Black",
        "price":"$0.00",
        "isSelected":"true"
      },
      {
        "text":"Brown",
        "price":"$0.00",
        "isSelected":"false"
      }],
      "conditionalLogic":
         {
           "actionType":"show",
           "logicType":"all",
           "checkbox":true,
           "rules":[{
             "fieldId":2,
             "operator":"or",
             "value":"Regular"
            },
            {
              "fieldId":3,
              "operator":"or",
              "value":"Low"
            }]
         }},
         {
           "type":"product","id":2,"label":"Color","placeholder":"Select Color","description":"Color Descrioton","defaultValue":"Red","choices":[{"text":"Red","price":"200","isSelected":"true"}],"conditionalLogic":""},{"type":"product","id":3,"label":"Select Fit","placeholder":"Select Jean Fit","description":"","defaultValue":"Fit","choices":[{"text":"Regular","price":"$0.00","isSelected":"false"},{"text":"Skinny","price":"$10.00","isSelected":"false"},{"text":"Fit","price":"$5.00","isSelected":"false"}],"conditionalLogic":{"actionType":"show","logicType":"all","checkbox":true}},{"type":"product","id":4,"label":"Select Rise","placeholder":"Select Rise","description":"","defaultValue":"Low","choices":[{"text":"High","price":"$29.00","isSelected":"false"},{"text":"Low","price":"$0.00","isSelected":"true"}],"conditionalLogic":""},{"type":"product","id":5,"label":"Size","placeholder":"Select Size","description":"","defaultValue":"Size 36","choices":[{"text":"Size 30","price":"100.00","isSelected":"false"},{"text":"Size 32","price":"100.00","isSelected":"true"},{"text":"Size 34","price":"100.00","isSelected":"true"},{"text":"Size 36","price":"100.00","isSelected":"false"}],"conditionalLogic":""}]';

$scope.attributes = jsonData;

HTML HTML

<div class="col-sm-6" ng-repeat="product_attribute in attributes">
  <div class=" form-group">
     <label class="font-noraml">{{product_attribute.label}}</label>
     <select class="form-control m-b" name="option_choices" ng-selected="option.isSelected=='true'" ng-model="option.price" ng-options="option.price as option.text for option in product_attribute.choices">
         <option value="">{{product_attribute.placeholder}}</option>
     </select>
  </div>
</div>

Above I have posted my JSON and HTML code.上面我已经发布了我的 JSON 和 HTML 代码。 I want to show all the attributes choices in my dropdown with default selected value.我想在我的下拉列表中显示所有attributes选择,并使用默认选择值。 Please check my HTML I have tried ng-selected="option.isSelected=='true'" to default select my choices options.请检查我的 HTML 我试过ng-selected="option.isSelected=='true'"默认选择我的选择选项。 But that is not working.但这行不通。

Screenshot:截屏:

在此处输入图片说明

You must have defaultValue as object that comprising all properties.Here is your solution -> jsfiddle您必须将defaultValue作为包含所有属性的对象。这是您的解决方案-> jsfiddle

For example:例如:

"defaultValue": {
        "text": "Black",
        "price": "$0.00",
        "isSelected": "true"
    }

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM