javascript - 在 Angular JS 中选择 - 我需要元素和值属性相同

Question

我有一个像这样的json，存储在$scope.result中:

{ "tips":["p1","p2","p3","p4"],"actualTip":"p4"}

我需要用 Angular 做一个组合框。我这样做了:

<select class="form-control" id="one" ng-model="actualTip" ng-options="tips for tips in result.tips" ></select>

它给了我一个像这样的组合框:

<option value="0"> p1 </option>
<option value="1"> p2 </option>
<option value="2"> p3 </option>

我需要选项的文本和值具有相同的“值”。

例如:

<option value="p1"> p1 </option>
<option value="p2"> p2 </option>

编辑:我忘了说我需要组合框以“actualTip”中所选的选项开头

我该怎么做？

Answer 1

这里是一个片段:http://codepen.io/rmadhuram/pen/leukx

不必担心 Angular 在选项中存储的值。您将在范围变量中获得所需的正确值(您可以在控制台中看到)。

此外，您只需使用所需的值初始化作用域变量即可。

JavaScript:

angular.module('app', [])
 .controller('testCtrl', ['$scope', function($scope) {
  $scope.result = { "tips":["p1","p2","p3","p4"],"actualTip":"p4"};

  $scope.onSelect = function() {
    console.log('selected: ' + $scope.actualTip);
  };

  $scope.actualTip = "p4"; 
}]);

HTML:

<div ng-app="app">
  <div ng-controller="testCtrl">
    <select class="form-control" id="one" ng-model="actualTip" ng-change="onSelect()" ng-options="tips for tips in result.tips" ></select>
  </div>
</div>