Question

我正在Angular中构建一个日期时间选择器，并且很难弄清楚如何使用ng-model的对象。我有一个小时哈希，name值为1-12，每个值都有AM和PM值。我没有遇到ng-options使用正确的名称/值生成选项选择，但是我很难弄清楚如何让ng-model从列表中选择正确的选项我在newPost模型中设置的值。

我的观点中有以下标记：

<div>
    <select name="hour" ng-options="hour.value as hour.name for hour in hours" ng-model="newPost.hour"></select>
</div>

然后在我的控制器中，我像这样构建我的currentHour对象：

var currentHourName = ((new Date()).getHours() + 24) % 12 || 12;
var currentHour = {
    name: currentHourName,
    value: {
        'AM': (((new Date()).getHours() + 24) % 12),
        'PM': (((new Date()).getHours() + 24) % 12) + 12
    }
};

// Ancillary attributes omitted for brevity.
$scope.newPost = {
    hour: currentHour
};


$scope.hours = [
    {name: 1, value: {'AM': 0,'PM': 12}},
    {name: 2, value: {'AM': 1,'PM': 13}},
    {name: 3, value: {'AM': 2,'PM': 14}},
    {name: 4, value: {'AM': 3,'PM': 15}},
    {name: 5, value: {'AM': 4,'PM': 16}},
    {name: 6, value: {'AM': 5,'PM': 17}},
    {name: 7, value: {'AM': 6,'PM': 18}},
    {name: 8, value: {'AM': 7,'PM': 19}},
    {name: 9, value: {'AM': 8,'PM': 20}},
    {name: 10, value: {'AM': 9,'PM': 21}},
    {name: 11, value: {'AM': 10,'PM': 22}},
    {name: 12, value: {'AM': 11,'PM': 23}}
];

我想知道的是如何使用ng-model来完成这项工作。

Answer 1

您可以使用track by内的ng-options。除此之外，不知道如何比较ng-model和选项之间的相等性。但是，如果您提供track by字段名称，它将使用此字段来检查相等性。

以下是plunker中的一个工作示例：Plunker Link

使用带有ngModel选项的对象选择

1 个答案: