如何使用角度JS设置一个下拉列表控件的选择的选项

如何使用角度JS设置一个下拉列表控件的选择的选项

问题描述:

我使用的角度JS和我需要设置采用了棱角分明的JS下拉列表控件的选择的选项。原谅我,如果这是荒谬的,但我用新的角度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>

它被填充后,我得到

After it gets populated I get

 <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>

如何设置为值控制=0来进行选择?

我希望我明白你的问题,但 NG-模型指令创建了一个双向的结合在控制选择的项目和 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.

如果变种是对象的数组, 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项被选中。