Question

我有以下ng-repeat：

<select class="action-dropdown fade" ng-model="item_value">
    <option value="" disabled>Choose an Step</option>
    <option ng-repeat="step in steps | orderBy:'+step_number'" ng-if="step.step_number >= active_step" value="{{$index}}">Step {{step.step_number}}</option>
</select>

我正在尝试将其更改为ng-option，因为弹出以下选项，我认为这可能会解决问题：

<option value="? string:5 ?"></option>

我试图了解如何在ng-option中加入我的ng-if语句，并在显示时使用步骤$index 这个词选项。

理解表达只是让我大吃一惊，我想知道是否有人可以帮助我。

这是我到目前为止所做的：

<select class="action-dropdown fade" ng-model="item_value" ng-options="$index as step.step_number for step in steps" required>
    <option value="" disabled>Choose a Step</option>
</select>

Answer 1

看起来像我评论的那样剪掉了

我认为最好的方式（更干净的方式）是填充更改active_step的步骤列表。要访问索引，您可以使用（键，值）语法

select as label for (key , value) in object

Doc：https://docs.angularjs.org/api/ng/directive/ngOptions

angular.module('app', [])
.controller('DefaultController', function () {
    this.item_value = null;
    this.steps = [ 
        { step_number: 5 }, 
        { step_number: 2 },  
        { step_number: 6 },
        { step_number: 3 },
    	{ step_number: 1 }, 
        { step_number: 4 },
    ]
  });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app="app">
  <div data-ng-controller="DefaultController as ctrl">
    <select ng-model="ctrl.item_value" ng-options="step as 'Step ' + index for (index, step) in ctrl.steps | orderBy:'+step_number'" required>
    <option value="" disabled>Choose a Step</option>
</select>
    
    Selected: {{ ctrl.item_value }}
  </div>
</div>

使用ng-option与排序和自定义文本

1 个答案: