2017-02-19 3 views
0

Ich möchte die Option "Tschad" in der Dropdown-Liste ausblenden, wenn der Benutzer "Cha" in das Eingabefeld eingeben. Dafür habe ich den folgenden Code geschrieben mit angular js und javascript und was sollte ich in die if-Klausel dort aufnehmen? Gibt es eine andere Methode, um dies durchzuführen?Ausblenden eines Elements in einer Dropdown-Liste basierend auf einer Bedingung in angular js

<!DOCTYPE html> 
<html lang="en"> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"> 
</script>     

<body> 
<div ng-app="myApp" ng-controller="myCtrl"> 
<form> 
First Name: 
<input type="text" ng-model="firstname"> 
</form> 

<select ng-model="selectedName" ng-options="name for name in names"> 
</select> 

</div> 

<script> 

var app = angular.module('myApp', []); 
app.controller('myCtrl', function($scope) { 
$scope.firstname = "Cha"; 

//assigning elements to the drop down list 
$scope.names = ["Chad", "Ab", "Za"]; 

if($scope.firstname=="Cha"{ 

//new code segment here 
} 

}); 



</script> 
</body> 
</html> 
+0

ich denke, das erreicht werden kann, unter Verwendung von splice() -Methode in Javascript –

Antwort

0

Versuchen Sie, diese

<!DOCTYPE html> 
 
<html lang="en"> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"> 
 
</script>     
 

 
<body> 
 
    <div ng-app="myApp" ng-controller="myCtrl"> 
 
     <form> 
 
      First Name: 
 
      <input type="text" ng-change="inputUpdate(firstname)" ng-model="firstname"> 
 
     </form> 
 

 
     <select ng-model="selectedName" ng-options="name for name in names"> 
 
     </select> 
 

 
    </div> 
 

 
    <script> 
 

 
     var app = angular.module('myApp', []); 
 
     app.controller('myCtrl', function($scope) { 
 
      // $scope.firstname = "Cha"; 
 

 
//assigning elements to the drop down list 
 
$scope.names1 = ["Chad", "Ab", "Za"]; 
 
$scope.names = ["Chad", "Ab", "Za"]; 
 

 
$scope.names2 = ["Ab", "Za"]; 
 

 
$scope.inputUpdate = function(name){ 
 
    if (name == 'Chad') { 
 
     $scope.names = $scope.names2; 
 
    } else{ 
 
     $scope.names = $scope.names1; 
 
    } 
 

 
} 
 

 
// if($scope.firstname=="Cha"{ 
 

 
// //new code segment here 
 
// } 
 

 
}); 
 

 

 

 
</script> 
 
</body> 
 
</html>

Verwandte Themen