obtenir la valeur de sélection d'une goutte avec angulars lit erreur

Question

J'essaie d'obtenir la valeur sélectionnée à partir d'une liste déroulante avec angularjs. Lorsque je sélectionne la valeur que je reçois cette erreur angular.min.js:108 TypeError: Cannot read property 'ftype' of undefined

HTML

<select name="select" ng-model="queryBy" ng-change="get_search_value(item)"> 
    <option ng-repeat="item in filter" value="{{item.ftype}}">{{item.ftype}}</option> 
</select> 

JS

$scope.search_type=''; 
    $scope.filter = [  
    { id: 1, ftype: "Complaint Type"}, 
    { id: 2, ftype: "Region" }, 
    { id: 3, ftype: "District"}, 
]; 

    $scope.get_search_value=function(item){ 
$scope.search_type=item.ftype; 
alert(item.ftype) 

    } 

Answer 1

Je pense que vous avez mal compris AngularJS ... Il fait tout cela pour vous. Vous n'avez pas besoin de mettre à jour une valeur distincte et vous n'avez pas besoin d'un événement de modification pour le faire pour vous.

Voici ce que je pense que vous essayez d'atteindre:

HTML

<select name="select" ng-model="queryBy"> 
    <option ng-repeat="item in filter" value="{{item.ftype}}">{{item.ftype}}</option> 
</select> 

JavaScript

$scope.filter = [  
    { id: 1, ftype: "Complaint Type"}, 
    { id: 2, ftype: "Region" }, 
    { id: 3, ftype: "District"} 
]; 

// you can access the selected value by using $scope.queryBy 

Ce qui est juste, juste en utilisant $scope.queryBy (ou tout simplement queryBy dans votre HTML) vous donnera la valeur de la sélection option. Comme je l'ai mentionné, vous pouvez également utiliser ngOptions au lieu de ngRepeat pour vos options. Je vous recommande également d'utiliser ngBind plutôt que des accolades lorsque vous le pouvez, cela évitera que l'expression elle-même ne clignote avant d'être évaluée.

Answer 2

Je pense item est invisible sur le niveau de <select>. Tout ce qui est dans le <option> (donc, le 'article') doit être enregistré dans la valeur ng-model, qui est queryBy. Pourquoi passez-vous item au get_search_value? Essayez acessing la queryBy dans la fonction get_search_value au lieu

Answer 3

Vous devez utiliser ngOptions - votre item est inaccessible la façon dont vous avez actuellement il. Voici un refactoring rapide qui devrait fonctionner: