如何使用AngularJS获取选项文本值？

发布时间：2020-12-17 08:29:03 所属栏目：安全来源：网络整理

导读：我试图使用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/divpOrdered by: {{product

我试图使用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。我试图得到文本值’产品1’。有没有办法做到这一点？

最好的方法是在select元素上使用ng-options指令。

控制器

function Ctrl($scope) {
  // sort options
  $scope.products = [{
    value: 'prod_1',label: 'Product 1'
  },{
    value: 'prod_2',label: 'Product 2'
  }];   
}

HTML

<select ng-model="productList" 
        ng-options="product as product.label for product in products">           
</select>

这将绑定所选的产品对象到ng-model属性 – productList。之后，您可以使用：

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

jsFiddle：http://jsfiddle.net/bmleite/2qfSB/

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!