angular.js - angular select如何获取选中的数据列

Question

<p>选项，{{selected}}</p>
<select ng-model="selected" ng-options="item.id as item.name for item in selectData">
        <option value="">-- 请选择 --</option>
</select>
$scope.selected = 1004;
$scope.selectData = [
    {id:1001,name:"零零一"},
    {id:1002,name:"零零二"},
    {id:1003,name:"零零三"},
    {id:1004,name:"零零四"}
];

如何获取选中的那一列数据。selected 只能获取到id值，但是我想要这一列的值。并且不干扰通过id值默认选中某一项。比如说我通过id:1004选中了这一项，我不单单要id值还要这一列的所有中。

Answer 1

Don’t you think there is a contradiction in your needs? You assign an id value to ng-model, but you also expect the value of ng-model to be an object?

If you want the final ng-model to be a column, but you can only give the id value of a selected item (which should be what you encountered during page editing), you can first filter out the corresponding item by giving the id and assign it to selected. And the ng-options expression needs to be changed to item as item.name for item in selectData track by item.id

$scope.selectData = [
  {id:1001,name:"零零一"},
  {id:1002,name:"零零二"},
  {id:1003,name:"零零三"},
  {id:1004,name:"零零四"}
];
$scope.selected = $scope.selectData.filter(item => item.id === 1004)[0];

<select ng-model="selected" ng-options="item as item.name for item in selectData track by item.id">
    <option value="">-- 请选择 --</option>
</select>

Answer 2

<p>选项，{{selected}}</p>
<select ng-model="selected" ng-options="item.name for item in selectData">
        <option value="">-- 请选择 --</option>
</select>
$scope.selected = $scope.selectData[3];
$scope.selectData = [
    {id:1001,name:"零零一"},
    {id:1002,name:"零零二"},
    {id:1003,name:"零零三"},
    {id:1004,name:"零零四"}
];