angularjs – Angular JS – 获取选择控件的选定文本

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

导读：我已按照以下链接解决问题,但它不起作用： How to get option text value using AngularJS? 我有一个包含一组服务器的下拉列表.当我从下拉列表中选择一个值时,我希望所选值显示在一个单独的div中.这是我做的：选择控制： select name="source" class="form-

我已按照以下链接解决问题,但它不起作用：
How to get option text value using AngularJS?

我有一个包含一组服务器的下拉列表.当我从下拉列表中选择一个值时,我希望所选值显示在一个单独的div中.这是我做的：

选择控制：

<select name="source" class="form-control input-sm"
                        ng-model="filterOptions.hostId"
                        ng-options="s.id as s.hostName for s in physicalServerList"
                        ng-style="{'width':'100%'}">
                </select>

显示所选文本：

<span class="pull-left">Source: {{ filterOptions.hostId.hostName }}</span>

但是,这不会显示所选文本.我究竟做错了什么？

解决方法

它不显示所选文本,因为您的模型将具有所选项的ID,因为在ng-options中使用s.id作为s.hostName(选择为标签语法).只需从语法中删除select作为部分,让ng-model保持所选对象的引用本身而不仅仅是id.

所以你的ng选项： –

ng-model="filterOptions.host"
ng-options="s.hostName for s in physicalServerList track by s.id"

并且您的模型将是所选对象,而不仅仅是所选项目的ID

<span class="pull-left">Source: {{ filterOptions.host.hostName }}</span>

Plnkr

（编辑：李大同）

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