Zurücksetzen auf nicht gebundene Option im Dropdown-Menü

Question

Ich habe ein Dropdown-Menü in HTML wie folgt mit einer Standardoption. Ich verwende ng-options, um die verbleibenden Optionen zu generieren, die diese und nicht die ersten mit der Variablen dropdown binden.

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

Ergebnisse in der folgenden 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> 

Ich brauche eine Reset-Taste zu unterstützen, die den Abfall bis auf die Standardoption zurückgedreht werden „Wählen Sie ein Element“. Da diese Option nicht an das Modell gebunden ist. ich kann so etwas tun -

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

oder sogar

$scope.dropdown = null 

Wie kann ich meine zurückgesetzt Dropdown-Liste die erste Option?

Answer 1

versuchen Sie es so.

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>