Question

我是AngularJS的新手，不知道如何解决以下问题：我想创建一个简单的基于年份的菜单：

2015
- 月
- 月
- ...
2014
- 月
- ...

这是我的代码：

控制器：

$scope.dateItems = [{date: <date_object>, year:<year_as_string>}, {date: <date_object>, year:<year_as_string>}, ...]

查看：

<ul class="dropdown-menu" role="menu" ng-init="year = '0'">
    <div ng-repeat="item in dateItems">
        <span ng-if="item.year !== year">
            <li role="menuitem">{{item.date | date:'yyyy'}}</li>
            <!-- change local variable "year" (see ng-init above) to item.year -->
        </span>
        <li role="menuitem">{{item.date | date:'MMM'}}</li>
    </div>
</ul>

如何更改year变量？或者是否有更好的解决方案而不是局部变量？

修改

感谢@MadScone我对所示案例有一个很好的解决方案。但我想概括一下这个问题：

<div ng-init="foo = 'bar'" ng-repeat="item in myItems">
    ...
    <div ng-if ...>
        <!-- set foo to another value -->
    </div>
</div>

是否可以在循环中更改foo的值？或者是否有另一种方法而不是ng-init来创建仅在视图中使用的局部变量（未绑定到控制器）？

Answer 1

您最好按年份对数据进行分组，因为这是显示的方式。

<强>控制器

$scope.dateItems = [
  {year: 2015, months: [new Date(), new Date()]},
  {year: 2014, months: [new Date(), new Date()]}
];

查看

<ul> <li ng-repeat="item in dateItems"> {{ item.year }} <ul ng-repeat="month in item.months"> <li>{{ month | date:'MMM' }}</li> </ul> </li> </ul>

AngularJS视图中的局部变量

1 个答案: