Question

使用angular自动选择下拉选项的最佳方法是什么？例如......

//controller
$scope.data = [{id: 1, status: "sent"}, {id: 2, status : "Not Sent"}]

//view.. How do i set it here to always have the status on "Not sent" to be already selected when the page is loaded? 
 <div> 

     <select> 
               ng-options="status.status as status.status for status in data">

   </select>

</div>

感谢您的时间！ AL

Answer 1

// controller
$scope.data = [{id: 1, status: "sent"}, {id: 2, status : "Not Sent"}];
$scope.selectedOption = $scope.data[0];

// view
<select ng-model='selectedOption' ng-options='d as d.status for d in data'>

Answer 2

你应该为select标签定义模型。试试这个。

＆＃13;

angular.module('myApp', []).controller('myTest', function($scope) {

$scope.data = [{id: 1, status: "sent"}, {id: 2, status : "Not Sent"}];
  $scope.select = $scope.data[0].status;

});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app = "myApp">
  <div ng-controller="myTest">
  <div> 

     <select ng-model="select"
               ng-options="status.status as status.status for status in data">

   </select>

</div>
   </div>
</div>

＆＃13;

Answer 3

您刚刚设置了model="string"：

＆＃13;

var myApp = angular.module('myApp', []);

myApp.controller('MyCtrl', function($scope) {
  
  $scope.data = [{id: 1, status: "sent"}, {id: 2, status : "Not Sent"}]
  $scope.selectedData = $scope.data[1];
  
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
 <div ng-app="myApp" ng-controller="MyCtrl"> 
   <select ng-model="selectedData"
           ng-options="status.status for status in data">
   </select>
</div>

＆＃13;

https://docs.angularjs.org/api/ng/directive/select

如何使用角度

3 个答案: