Question

需要在此处设置默认值表单 - status。

"projectSteps":{
        "red":{
            "date":"11/03/2015",
            "status":"ready"
        },
        "green":{
            "date":"11/03/2015",
            "status":"not ready"
        }
        "blue":{
            "date":"11/03/2015",
            "status":"done"
        }
    },

这是下拉json：

"status":[
       {"value":"ready"},
       {"value":"not ready"},
       {"value":"done"} 
]

以下是带有ng-repeat选项的html：

<tr ng-repeat="(step, q)  in steps">
       <td>{{$index}}</td>
       <td>
          <label for="stepsStatus">label</label>
          <select data-ng-model="filterItem.status" id="stepsStatus" required class="form-control" ng-options="a as a.value for a in q.status"></select>
       </td>   
    </tr>

将值作为下拉列表，但无法设置projectSteps的默认值。

data-ng-model="filterItem.status" 
$scope.filterItem = {
            status: $scope.projectSteps
        }

Answer 1

您需要将ng-model设置为您想要选择的值：

在html中：

<select id="stepsStatus" required class="form-control" 
    ng-options="a as a.value for a in q.status" ng-model="selectedStep"></select>

并在控制器中：

$scope.selectedStep = // set whatever you want selected

Answer 2

通过这种方式，我只显示了所选类别的图标。

 <select id="stepsStatus" required ng-model="q.status[0]" ng-options="a as a.value for a in q.status" ></select>
 <span class="{{q.status[0].icon}}"></span>

所以JSON文件也用图标对更新

"projectSteps":{
    "red":{
        "date":"11/03/2015",
        "status":"ready",
        "icon":"done"
    },
    "green":{
        "date":"11/03/2015",
        "status":"not ready",
        "icon":"not ready"
    }
    "blue":{
        "date":"11/03/2015",
        "status":"done",
        "icon":"ready"
    }
}

使用AngularJS在下拉菜单中从模型设置默认选定选项的正确方法

2 个答案: