javascript - AngularJS 默认下拉选择不工作

Question

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

<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>

上面我已经发布了我的 JSON 和 HTML 代码。我想在我的下拉列表中显示所有 attributes 选择默认选择值。请检查我的 HTML 我已经尝试 ng-selected="option.isSelected=='true'" 默认选择我的选择选项。但这是行不通的。

截图:

Answer 1

您必须将 defaultValue 作为包含所有属性的对象。这是您的解决方案 -> jsfiddle

例如:

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