success - 如何使用AngularJS獲取選項文本值?




var app angular module (3)

我正在嘗試使用AngularJS獲取選項列表的文本值

這是我的代碼片段

<div class="container-fluid">
        Sort by:
        <select ng-model="productList">
            <option value="prod_1">Product 1</option>
            <option value="prod_2">Product 2</option>
        </select>
</div>

<p>Ordered by: {{productList}}</p>

{{productList}}返回選項的值,例如:prod_1。 我正在嘗試獲取文本值'Product 1'。 有沒有辦法做到這一點?


你也可以這樣做:

<select class="form-control postType" ng-model="selectedProd">
    <option ng-repeat="product in productList" value="{{product}}">{{product.name}}</option>
</select>

其中“selectedProd”將被選中產品。


在select元素中,您甚至可以使用以下命令代替ng-options="product as product.label for product in products">

<option ng-repeat="product in products" value="{{product.label}}">{{product.label}}

哪個也很好用。


<div ng-controller="ExampleController">
  <form name="myForm">
    <label for="repeatSelect"> Repeat select: </label>
    <select name="repeatSelect" id="repeatSelect" ng-model="data.model">
      <option ng-repeat="option in data.availableOptions" value="{{option.id}}">{{option.name}}</option>
    </select>
  </form>
  <hr>
  <tt>model = {{data.model}}</tt><br/>
</div>

AngularJS:

angular.module('ngrepeatSelect', [])
 .controller('ExampleController', ['$scope', function($scope) {
   $scope.data = {
    model: null,
    availableOptions: [
      {id: '1', name: 'Option A'},
      {id: '2', name: 'Option B'},
      {id: '3', name: 'Option C'}
    ]
   };
}]);

取自AngularJS docs







angularjs