如何使用angular JS设置下拉列表控件的选定选项 [英] How to set a selected option of a dropdown list control using angular JS

问题描述

我正在使用 Angular JS，我需要使用 angular JS 设置下拉列表控件的选定选项.如果这很荒谬，请原谅我，但我是 Angular JS 的新手

I am using Angular JS and I need to set a selected option of a dropdown list control using angular JS. Forgive me if this is ridiculous but I am new with Angular JS

这是我的html的下拉列表控件

Here is the dropdown list control of my html

 <select ng-required="item.id==8 && item.quantity > 0" name="posterVariants"
   ng-show="item.id==8" ng-model="item.selectedVariant" 
   ng-change="calculateServicesSubTotal(item)"
   ng-options="v.name for v in variants | filter:{type:2}">
  </select>

填充后我得到

 <select ng-options="v.name for v in variants | filter:{type:2}" ng-change="calculateServicesSubTotal(item)"
ng-model="item.selectedVariant" ng-show="item.id==8" name="posterVariants"
ng-required="item.id==8 &amp;&amp; item.quantity &gt; 0" class="ng-pristine ng-valid ng-valid-required">
    <option value="?" selected="selected"></option>
    <option value="0">set of 6 traits</option>
    <option value="1">5 complete sets</option>
</select>

如何设置value="0"的控件被选中?

How can I set the control for value="0" to be selected?

推荐答案

我希望我理解你的问题，但是 ng-model 指令在控件中的选定项之间创建了双向绑定和 item.selectedVariant 的值.这意味着在 JavaScript 中更改 item.selectedVariant 或更改控件中的值，会更新另一个.如果 item.selectedVariant 的值为 0，则该项目应该被选中.

I hope I understand your question, but the ng-model directive creates a two-way binding between the selected item in the control and the value of item.selectedVariant. This means that changing item.selectedVariant in JavaScript, or changing the value in the control, updates the other. If item.selectedVariant has a value of 0, that item should get selected.

如果 variants 是一个对象数组，item.selectedVariant 必须设置为这些对象之一.我不知道您的范围内有哪些信息，但这里有一个示例:

If variants is an array of objects, item.selectedVariant must be set to one of those objects. I do not know which information you have in your scope, but here's an example:

JS:

$scope.options = [{ name: "a", id: 1 }, { name: "b", id: 2 }];
$scope.selectedOption = $scope.options[1];

HTML:

<select data-ng-options="o.name for o in options" data-ng-model="selectedOption"></select>

这将使b"项被选中.

这篇关于如何使用angular JS设置下拉列表控件的选定选项的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！