Question

我有简单的select标记，其中包含一些简单的选项：

<select name="select" id="select">
    <option value="1">=</option>
    <option value="2">!=</option>
    <option value="3">^</option>
</select>

现在，我希望当用户点击select代码时，我会显示文字文字而不是 = ，！= ， ^ ，我的意思是相等，不相等，以开头，但是当用户选择其中一个值时，请将实际文本显示为已选择。< / p>

我在这个视图中使用angularjs。

Answer 1

您必须执行以下操作：

<select name="select" id="select">
    <option value="equals">=</option>
    <option value="not equals">!=</option>
    <option value="start with">^</option>
</select>

在AngularJS代码中，您必须检索值（这是最常见的事情），而不是选项标记之间的文本。这样你仍然可以显示<option></option>之间的符号，但是值隐藏在选项标签中，并且您想要将实际单词设置为选项的值

Answer 2

您可以在控制器中为下拉列值创建一个对象数组：

$scope.options=[
 {
  Description:"=", 
  Value:"equals"
 },
 {
  Description:"!=", 
  Value:"not equals"
 },
 {
  Description:"^", 
  Value:"start with"
 }
];

在你的html中，你可以遍历你的选项对象，只在选择选项中显示你的对象的“描述”，一旦选择了一个选项，它就会被分配给你的ng模型：

<select ng-model="mySelect" ng-options="o as o.Description for o in options" >
</select>
<div>
  {{mySelect.Value}}
</div>

看看这个工作小提琴：https://jsfiddle.net/xnzp78ju/

选择标签打开和关闭时如何显示另一个文本？

2 个答案: