javascript - 按天应用 View 中的 Controller 数据

Question

我正在尝试使用 AngularJS 创建一个星期日历，但我无法将事件添加到我正在查看日历的一周中的 7 个框上。我有这个 html 布局

<div class="week">
    <ul></ul>
    <ul></ul>
    <ul></ul>
    <ul></ul>
    <ul></ul>
    <ul></ul>
    <ul></ul>
</div>

在 Controller 中我得到了这个变量 jsonEvents到目前为止在测试模式下有这个数据。

$scope.jsonEvents = [
        {"event_id":"1","event_name":"Basketball","event_startdate":"2","event_stopdate":"5"},
        {"event_id":"2","event_name":"Party","event_startdate":"3","event_stopdate":"3"}
    ];

我想做的是，因为第一个事件有从 2 到 5 的数据，所以添加一个 <li>Basketball</li>在第 2、3、4 和 5 <ul>'s因为第二个事件从 3 开始并以 3 结束，所以要添加 <li>进入第三<ul> .我需要一个指令来做那件事吗？提前谢谢你，丹尼尔!

Answer 1

这会生成一个列表，其中仅在相关日期下显示您的元素...

  <div ng-repeat="day in [1,2,3,4,5,6,7]">
        <div>Day {{day}}
            <ul><li ng-repeat="data in jsonEvents | filter:onDay(day)">{{data.event_name}}</span></li></ul>
        </div>
      </div>

并将其添加到您的 Controller 中:

  $scope.onDay = function(day)  {

    return function(data) {
      return data.event_startdate <= day && data.event_stopdate >= day;
    }
  }

参见 http://plnkr.co/edit/GiNJy74YGyVtVfO5zxV0