Question

我正在尝试创建一个下拉菜单，但是当它加载时，我会得到一个空的下拉选择框。

我使用以下html：

<tr ng-repeat="i in data.suggestions">
    <td>
        <select ng-model="i.selYears" ng-options="selYears for val in selYears"></select>
    </td>
</tr>

有了这些数据：

[
    {
        "years": [1, 2, 5]
    },
    {
        "years": [1, 2, 5]
    },
    {
        "years": [1, 2, 5]
    }
]

我的数据结构有问题，还是ng-options？

以下是我想要的最终输出：

<tr>
    <td>
        <select>
            <option value="1">1 year</option>
            <option value="2" selected="selected">2 years</option>
            <option value="5">5 years</option>
        </select>
    </td>
</tr>
<tr>
    <td>
        <select>
            <option value="1">1 year</option>
            <option value="2" selected="selected">2 years</option>
            <option value="5">5 years</option>
        </select>
    </td>
</tr>
<tr>
    <td>
        <select>
            <option value="1">1 year</option>
            <option value="2" selected="selected">2 years</option>
            <option value="5">5 years</option>
        </select>
    </td>
</tr>

Answer 1

您试图在控制器范围级别而不是selYears级别重复对象ng-repeat。

您应该执行以下操作，以便在ng-options项目的{Property {1}}

的子属性中每年都有ng-repeat

years

编辑：拥有这样的数据（并使用上面的HTML）将允许为每个列表选择初始值。

<select ng-model="i.value" ng-options="year for year in i.years"></select>

Answer 2

下面的代码应该可以正常工作

  <select ng-options="y.years as y.years for y in selYears" ></select>

假设selYears是$ scope的属性，例如

 $scope.selYears = [
    {
        "years": [1, 2, 5]
    },
    {
        "years": [1, 2, 5]
    },
    {
        "years": [1, 2, 5]
    }

Answer 3

Html：

<tr ng-repeat="i in data.suggestions">
    <td>
        <select ng-model="i.selYears" ng-options="year for year in i.years"></select>
    </td>
    <td>
        value : {{i.selYears}}
    </td>
</tr>

JS：

$scope.data = {
    "suggestions" : [
        {
            "years": [1, 2, 5],
        },
        {
            "years": [1, 2, 5],
        },
        {
            "years": [1, 2, 5],
        }
      ]
   };

http://jsfiddle.net/9ybwpfth/1/

Answer 4

您必须在 json 数据的下拉列表中指定要显示的字段名称。

$arr00 = [0,1,2,...,9]; // It includes 9 arrays. So the score should be 9.
$arr01 = [0,1,...,8];   // score = 8
...
$arr09 = [0];           // score = 0

ngOptions创建空下拉列表

4 个答案: