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

<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'"默認選擇我的選擇選項。 但這行不通。

截屏:

在此處輸入圖片說明

您必須將defaultValue作為包含所有屬性的對象。這是您的解決方案-> jsfiddle

例如:

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

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM