ドロップダウンメニューのアンバウンドオプションにリセット

Question

私はデフォルトのオプションで、以下のようなHTMLのドロップダウンメニューを持っています。私は残りのオプションを生成するためにng-optionsを使用しています。したがって、最初の変数は変数dropdownでバインドされていません。以下のHTML

<td> 
    <select ng-model="dropdown" ng-options="item as item.name for item in items"> 
     <option value="">--- Select an item---</option> 
     <option value="0" label="item1">item1</option> 
     <option value="1" label="item2">item2</option> 
     <option value="2" label="item3">item3</option> 
    </select>         
</td> 

にで

<td> 
    <select ng-model="dropdown" ng-options="item as item.name for item in items"> 
     <option value="">--- Select an item---</option> <!-- default --> 
    </select>         
</td> 

結果は、私が「項目を選択し、」デフォルトのオプションにドロップダウンをリセットする必要があり、リセットボタンを、サポートする必要があります。このオプションはモデルにバインドされていないためです。私はこのような何かを傾ける -

$scope.dropdown = items[0] // this would select item1 

または私は最初のオプションに自分のドロップダウンをリセットすることができますどのようにしても

$scope.dropdown = null 

？

Answer 1

このようにしてください。

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

 
app.controller("MyCtrl" , function($scope){ 
 
    $scope.items = [{name:"ali"},{name:"reza"}]; 
 
    
 
    $scope.dropdown = $scope.items[0]; 
 
    $scope.reset = function(){ 
 
    $scope.dropdown = {}; 
 
    } 
 
    
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="app" ng-controller="MyCtrl"> 
 
    
 
    <select ng-model="dropdown" ng-options="item as item.name for item in items"> 
 
     <option value="">--- Select an item---</option> 
 
     
 
    </select> 
 
    <button type="submit" name="button" ng-click="reset()">Reset</button> 
 
    
 
</div>