как получить доступ к атрибуту значения тега select в angularjs

Question

Я хочу получить атрибут значения параметров выбора ... вот мой HTML

<select ng-model = "selectedElement">
 <option vlaue = "1">john</option>
 <option vlaue = "2">harry</option>
 <option vlaue = "3">peter</option>
</select>

, когда я запускаю код

console.log($scope.selectedElement);

Я получил результат"john" в консоли, но я ожидал получить атрибут value.например, "1" в консоли.есть ли способ сделать это.

Answer 1

<select ng-model="cart.fruit" ng-options="state as state.name for state in shelf"></select>
<br/>
<tt>Cost & Fruit selected: {{cart.fruit}}</tt>

Попробуйте код выше.

Answer 2

Вам также следует попробовать этот код.Определите данные вашего блока выбора как массив.

$scope.Fruits = [{
            Id: 1,
            Name: 'Apple'
        }, {
            Id: 2,
            Name: 'Mango'
        }, {
            Id: 3,
            Name: 'Orange'
        }];

Затем определите функцию на странице вашего контроллера.

      $scope.GetValue = function (fruit) {
            var fruitId = $scope.ddlFruits;
            var fruitName = $.grep($scope.Fruits, function (fruit) {
                return fruit.Id == fruitId;
            })[0].Name;
            $window.alert("Selected Value: " + fruitId + "\nSelected Text: " + fruitName);
        }

И, наконец, добавьте тег выбора в ваш html.

       <select ng-model="ddlFruits" ng-options="fruit.Id as fruit.Name for fruit in Fruits track by fruit.Id"
        ng-change="GetValue()">
    </select>

Попробуйте с этим кодом. Надеюсь, это решит вашу проблему.

Answer 3

Вы используете vlaue в option, что неверно.Используйте value, который установит значение каждого параметра и даст вам это значение на $scope.selectedElement

var app = angular.module('myApp', []);
app.controller('MainCtrl', ['$scope', function($scope) {
  
}]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="MainCtrl">

  <select ng-model="selectedElement">
    <option value="1">john</option>
    <option value="2">harry</option>
    <option value="3">peter</option>
  </select>
  selected value is {{selectedElement}}
</div>