2017-02-19 37 views
0

如果用戶在輸入字段中鍵入「Cha」,我想在下拉列表中隱藏「Chad」選項。 爲此,我使用angular js和javascript編寫了以下代碼,並且應該在if子句中包含哪些內容? 有沒有其他方法來執行此操作?根據角度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

我認爲這是可以用在JavaScript拼接()方法來實現 –

回答

0

試試這個

<!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>

相關問題