如何在Angularjs中獲取選定的optgroup值？

Question

與我的應用程序，我想要在選擇下拉列表中選擇optgroup值。

下面是代碼

HTML：

<select ng-model='theModel' ng-change="display(theModel)" > 
     <optgroup ng-repeat='group in collection' label="{{group.Name}}"> 
     <option ng-repeat='veh in group.Fields'>{{veh.Name}}</option> 
     </optgroup> 
</select> 

Controlelr：

$scope.display = function(name) { 
     alert(name); // i want to get the selected value and the optgroup value 
} 

DEMO APP

輸出所需： 我想顯示所選OPTGROUP值，如果我下收集1選擇場1，我需要Collection1.Field1

Answer 1

我已經更新在選項的值，以保持組和值的基準作爲好。如果組中的值將是唯一的，那麼我們可以使用一個值來將控制器變量中的圖組合起來，並從那裏獲得任何數據。但是，由於同樣的價值觀存在於團體中，我保留了參與團體的選擇價值，並使用了它。

現在選擇框中顯示的文本是所需的，並更新選項的值以保留組的參考。所以兩者現在都可用。

更新Plunkr：https://plnkr.co/edit/zvNcdDe0kmMJ1R67hOkK?p=preview

控制器：

var app = angular.module('todoApp', []); 

app.controller("dobController", ["$scope", "$http", 
    function($scope, $http) { 
    $http.get('test.json').then(function(response) { 
     $scope.collection = response.data.Collections; 
     console.log(response); 
    }); 

    $scope.matches = []; 

    $scope.display = function(name) { 

     alert("controller:"+name.split("::")[0]+" and value ::"+name.split("::")[1]); 
    } 

    } 
]); 

HTML：

<select ng-model='theModel' ng-change="display(theModel)"> 
    <optgroup ng-repeat='group in collection' label="{{group.Name}}"> 
    <option ng-repeat='veh in group.Fields' value='{{group.Name}}::{{veh.Name}}'>{{veh.Name}}</option> 
    </optgroup> 
    </select>