AngularJS選擇下拉菜單-選擇默認選項

Question

我有AngluarJs下拉列表，每個“ onchange”選項都將導航到另一個頁面。 這是代碼：

   <select class="qtDropDown" 
           ng-model="Suggested" 
           ng-change="changeOption()" 
           ng-options="option.name for option in suggested">

JS。

     $scope.suggested = StrategyService.getPredefinedStrategies();
     $scope.Suggested = $scope.suggested[0];

     $scope.changeOption = function () {
        var selectedStrategy = $scope.Suggested;
        var queryString = selectedStrategy.name.split(' ').join(''); 
        window.location.href(baseUrl+queryString);
     };       

問題是當我單擊默認選擇$scope.suggested[0]; 它不是在導航用戶。 有人可以建議我在哪里做錯嗎？

Answer 1

這很正常，因為當您選擇$ scope.suggested [0]時，如果沒有更改，則沒有更改。

一種防止這種情況的方法是添加空白選項

<select class="qtDropDown" ng-model="Suggested" ng-change="changeOption()" 
ng-options="option.name for option in suggested">
    <option value=""> - Choose one of the following - </option>
</select>

這樣，當您選擇$ scope.suggested [0]時，將觸發更改。

Answer 2

只需在您的javascript中觸發changeOption函數即可：)

您選擇的是默認選項，但是具有更改值時需要觸發的功能..所以只需將代碼修改為：

     $scope.suggested = StrategyService.getPredefinedStrategies();

     $scope.changeOption = function () {
        var selectedStrategy = $scope.Suggested;
        var queryString = selectedStrategy.name.split(' ').join(''); 
        window.location.href(baseUrl+queryString);
     };     
     $scope.Suggested = $scope.suggested[0];
     $scope.changeOption(); // this will trigger the change of the default value

Answer 3

<select name="qtDropDown" id="qtDropDown">
<option value="url">...</option>

var urlmenu = document.getElementById( 'Select' );
urlmenu.onchange = function() {
window.open(  this.options[ this.selectedIndex ].value );
};

使用angular js，在div標簽中添加ng-model。