Question

我确实为每个部门显示了task_time的总和，但此时它显示了我想要显示的所有值，只显示日期=当前日期。

例如，我想只显示＆＃34; array＆＃34;中日期的值的总和。 = 2017年3月。我不在乎日子。

HTML：

<body ng-app="ngrepeatSelect">
    <div ng-controller="ExampleController">
    <p>
    Current date: {{currTime  | date:'yyyy-MM-dd'}}
    </p>
        <md-table-container>
            <table md-table>
                <thead md-head>
                    <tr md-row>
                        <th md-column>Dept</th>
                        <th md-column>Total time</th>
                        <th md-column></th>
                    </tr>
                </thead>
                <tbody md-body>
                    <tr ng-if="!data.model" md-row md-select="test" md-on-select="" md-auto-select ng-repeat="test in tests">
                        <td md-cell>{{ test.dept }}</td>
                        <td md-cell>{{ test.total }}</td>
                        <td md-cell></td>
                    </tr>
                </tbody>
            </table>
        </md-table-container>
    </div>
</body>

JS：

angular.module('ngrepeatSelect', ['ngMaterial'])
    .controller('ExampleController', function($scope, $filter) {
    var data = [{
            id: "1",
            user: "John Doe",
            dept: "test",
            date: "2017-03-02",
            task_time: "83"
        }, {
            id: "2",
            user: "Mark Doe",
            dept: "test",
            date: "2017-02-02",
            task_time: "41"
        }, {
            id: "3",
            user: "Zac Doe",
            dept: "other",
            date: "2017-02-04",
            task_time: "12"
        }, {
            id: "4",
            user: "Zac Doe",
            dept: "test",
            date: "2017-03-02",
            task_time: "41"
        }, {
            id: "5",
            user: "Zac Doe",
            dept: "test",
            date: "2017-03-02",
            task_time: "41"
        },{
            id: "6",
            user: "Zac Doe",
            dept: "test2",
            date: "2017-03-02",
            task_time: "41"
        },{
            id: "7",
            user: "John Doe",
            dept: "test",
            date: "2017-01-02",
            task_time: "41"
        },{
            id: "8",
            user: "Zac Doe",
            dept: "test",
            date: "2017-01-01",
            task_time: "41"
        },{
            id: "9",
            user: "John Doe",
            dept: "tests",
            date: "2017-02-12",
            task_time: "41"
        }, {
            id: "10",
            user: "Zac Doe",
            dept: "test2",
            date: "2017-02-13",
            task_time: "53"
        }];
        $scope.currTime = new Date();
             var totalPerDept = [];
        angular.forEach(data, function(item) {
            var index = findWithAttr(totalPerDept, 'dept', item.dept);

            if (index < 0) {
                totalPerDept.push({
                    dept: item.dept,
                    total: parseFloat(item.task_time)
                });
            } else {
                totalPerDept[index].total += parseFloat(item.task_time);
            }
        });
        $scope.tests = totalPerDept;

        function findWithAttr(array, attr, value) {
            for (var i = 0; i < array.length; i += 1) {
                if (array[i][attr] === value) {
                    return i;
                }
            }
            return -1;
        }

    });

我已创建jsFiddle来展示我正在做的事情。

Answer 1

您可以使用Moment.js并使用isSame函数检查月份和年份是否匹配。我更新了fiddle以使用Moment。

angular.forEach(data, function(item) {
  var index = findWithAttr(totalPerDept, 'dept', item.dept);

  if (index < 0) {
    totalPerDept.push({
      dept: item.dept,
      total: checkDate(item.date) ? parseFloat(item.task_time) : 0
    });
  } else {
    if (checkDate(item.date)) {
      totalPerDept[index].total += parseFloat(item.task_time);
    }
  }
});

$scope.tests = totalPerDept;

function checkDate(date) {
  return moment().isSame(date, 'month');
}

Answer 2

我更新了你的小提琴here。

脚本

angular.module('ngrepeatSelect', ['ngMaterial'])
.controller('ExampleController', function ($scope, $filter) {
  var data = [{
      id: "1",
      user: "John Doe",
      dept: "test",
      date: "2017-03-02",
      task_time: "83"
  }, {
      id: "2",
      user: "Mark Doe",
      dept: "test",
      date: "2017-02-02",
      task_time: "41"
  }, {
      id: "3",
      user: "Zac Doe",
      dept: "other",
      date: "2017-02-04",
      task_time: "12"
  }, {
      id: "4",
      user: "Zac Doe",
      dept: "test",
      date: "2017-03-02",
      task_time: "41"
  }, {
      id: "5",
      user: "Zac Doe",
      dept: "test",
      date: "2017-03-02",
      task_time: "41"
  }, {
      id: "6",
      user: "Zac Doe",
      dept: "test2",
      date: "2017-03-02",
      task_time: "41"
  }, {
      id: "7",
      user: "John Doe",
      dept: "test",
      date: "2017-01-02",
      task_time: "41"
  }, {
      id: "8",
      user: "Zac Doe",
      dept: "test",
      date: "2017-01-01",
      task_time: "41"
  }, {
      id: "9",
      user: "John Doe",
      dept: "tests",
      date: "2017-02-12",
      task_time: "41"
  }, {
      id: "10",
      user: "Zac Doe",
      dept: "test2",
      date: "2017-02-13",
      task_time: "53"
  }];
  $scope.currTime = new Date();
  var totalPerDept = [];
  angular.forEach(data, function (item) {
      var index = findWithAttr(totalPerDept, 'dept', item.dept);

      if (index < 0) {
          totalPerDept.push({
              dept: item.dept,
              total: parseFloat(item.task_time)
          });
      } else {
          totalPerDept[index].total += parseFloat(item.task_time);
      }
  });
  $scope.tests = totalPerDept;

  function findWithAttr(array, attr, value) {
      for (var i = 0; i < array.length; i += 1) {
          if (array[i][attr] === value) {
              return i;
          }
      }
      return -1;
  }

  $scope.getTotalTime = function (dept) {
      var totalTime = 0;
      angular.forEach(data, function (item) {
          if (item.dept == dept && item.date.indexOf($scope.currTime.format('YYYY-MM')) > -1)
              totalTime += parseInt(item.task_time, 10);
      });
      return totalTime;
  }

  $scope.getMonth = function (date) {
      return date.format('MMMM YYYY');
  }

});

    (function () {
        var D = "Sunday,Monday,Tuesday,Wednesday,Thursday,Friday,Saturday".split(","),
            M = "January,February,March,April,May,June,July,August,September,October,November,December".split(",");
        Date.prototype.format = function (format) {
            var me = this;
            return format.replace(/a|A|Z|S(SS)?|ss?|mm?|HH?|hh?|D{1,4}|M{1,4}|YY(YY)?|'([^']|'')*'/g, function (str) {
                var c1 = str.charAt(0),
                    ret = str.charAt(0) == "'"
                    ? (c1 = 0) || str.slice(1, -1).replace(/''/g, "'")
                    : str == "a"
                      ? (me.getHours() < 12 ? "am" : "pm")
                      : str == "A"
                        ? (me.getHours() < 12 ? "AM" : "PM")
                        : str == "Z"
                          ? (("+" + -me.getTimezoneOffset() / 60).replace(/^\D?(\D)/, "$1").replace(/^(.)(.)$/, "$10$2") + "00")
                          : c1 == "S"
                            ? me.getMilliseconds()
                            : c1 == "s"
                              ? me.getSeconds()
                              : c1 == "H"
                                ? me.getHours()
                                : c1 == "h"
                                  ? (me.getHours() % 12) || 12
                                  : (c1 == "D" && str.length > 2)
                                    ? D[me.getDay()].slice(0, str.length > 3 ? 9 : 3)
                                    : c1 == "D"
                                      ? me.getDate()
                                      : (c1 == "M" && str.length > 2)
                                        ? M[me.getMonth()].slice(0, str.length > 3 ? 9 : 3)
                                        : c1 == "m"
                                          ? me.getMinutes()
                                          : c1 == "M"
                                            ? me.getMonth() + 1
                                            : ("" + me.getFullYear()).slice(-str.length);
                return c1 && str.length < 4 && ("" + ret).length < str.length
                  ? ("00" + ret).slice(-str.length)
                  : ret;
            });
        };
    })();

HTML

<body ng-app="ngrepeatSelect">
<div ng-controller="ExampleController">
    <p>
        Current date: {{currTime  | date:'yyyy-MM-dd'}}
    </p>
    <md-table-container>
        <table md-table>
            <thead md-head>
                <tr md-row>
                    <th colspan="3">{{getMonth(currTime)}}</th>
                </tr>
                <tr md-row>
                    <th md-column>Dept</th>
                    <th md-column>Total time</th>
                    <th md-column></th>
                </tr>
            </thead>
            <tbody md-body>
                <tr ng-if="!data.model" md-row md-select="test" md-on-select="" md-auto-select ng-repeat="test in tests">
                    <td md-cell>{{ test.dept }}</td>
                    <td md-cell>{{ getTotalTime(test.dept) }}</td>
                    <td md-cell></td>
                </tr>
            </tbody>
        </table>
    </md-table-container>
</div>

Answer 3

可以在不使用Moment.js的情况下完成。只需要使用Date对象方法。

angular.forEach(data, function(item) {
        var index = findWithAttr(totalPerDept, 'dept', item.dept);

        if (index < 0) {
            totalPerDept.push({
                dept: item.dept,
                total: checkDate(item) ? parseFloat(item.task_time) : 0
            });
        } else {
                if(checkDate(item)) {
                totalPerDept[index].total += parseFloat(item.task_time);
            }
        }
    });
    $scope.tests = totalPerDept;

    function checkDate(item) {
        var date = new Date(item.date);
      var currDate = new Date();
      return (currDate.getMonth() === date.getMonth() && currDate.getYear() === date.getYear() );
    }

显示当前日期的所有总和

3 个答案: