对象数组AngularJS中的属性总和

Question

我对 angularjs 和 javascript 都很陌生，需要一些指导。我正在制作一个记录项目时间日志的应用程序。其中一列需要是增量时间 - 开始日志和完成日志之间的时间差以及带走间隔时间（例如，如果我在下午 1 点开始一个项目，在下午 3 点完成但在增量时间之间有 30 分钟的休息时间会为 2 和 1/2 小时）。 到目前为止，这是我的代码，无论我尝试做什么，要么出现错误的时间，要么出现 NaN。任何帮助将不胜感激！

查看：

<div class="main" ng-controller="MainController">
  <div class="container-fluid">

    <div class="header">
  <div class="container-fluid">
    <h1>{{ title }}</h1>
  </div>
</div>

    <div class="row container-fluid">
        <!--<div class="col-md-4">-->
            <div class="panel panel-default">
                <div class="panel-body">
                    <!--<<form ng-submit="addNew(timeLogs)" >-->
                    <form>

                        <div class="form-group col-md-6">
                            <label>Project</label>
                            <input type="text" class="form-control" placeholder="Project" ng-model="project" >   
                        </div>

                        <div class="form-group col-md-6">
                            <label>Phase</label>
                            <input type="text" class="form-control" placeholder="Phase" ng-model="phase" >   
                        </div>

                        <div class="form-group col-md-6">
                            <label>Date</label>
                            <input type="date" class="form-control" placeholder="dd-MM-yyyy" ng-model="date" >  
                        </div>

                        <div class="form-group col-md-6">
                            <label>Start Time</label>
                            <input type="time" class="form-control" placeholder="HH:mm:ss" ng-model="startTime" required>   
                        </div>

                        <div class="form-group col-md-6">
                            <label>Interval Time (mins)</label>
                            <input type="text" class="form-control without" placeholder="Int Time" ng-model="intTime" >   
                        </div>

                        <div class="form-group col-md-6">
                            <label>End Time</label>
                            <input type="time" class="form-control" placeholder="HH:mm:ss" ng-model="endTime" required>  
                        </div>

                        <div class="form-group col-md-6">
                            <label>Comments</label>
                            <input type="text" class="form-control" placeholder="Comments" ng-model="comments" >  
                        </div>


                            <button ng-click="addLog()">Add</button>   

                    </form>
                </div>
            </div>
        <!--</div>-->
    </div>

    <table class="table table-striped col-md-4">
      <tr>
        <th>Project</th>
        <th>Phase</th>
        <th>Date</th>
        <th>Start Time</th>
        <th>Int Time (mins)</th>
        <th>Stop Time</th>
        <th>Delta Time</th>
        <th>Comments</th>
        <th>Make Changes</th>
      </tr>
      <tr data-ng-repeat="log in logs">
        <td>{{ log.project }}</td>
        <td>{{ log.phase }}</td>
        <td>{{ log.date | date:'dd/MM/yyyy' }}</td>
        <td>{{ log.startTime | date:'hh:mma' }}</td>
        <td>{{ log.intTime }}</td>
        <td>{{ log.endTime | date:'hh:mma' }}</td>
        <td>{{ log.startTime -- log.endTime | date:'hh:mma' }}</td>
        <td>{{ log.comments }}</td>
        <td>
          <button class="btn btn-primary" ng-click="main.editClickHandler(item)">Edit</button>
          <button class="btn btn-danger" ng-click="main.removeClickHandler(item)">Remove</button> 
        </td>
      </tr>
    </table>

  </div>
</div>


<!-- Modules -->
<script src="js/app.js"></script>

<!-- Controllers -->
<script src="js/controllers/MainController.js"></script>

控制器：

app.controller('MainController', ['$scope', function($scope) {
 $scope.title = 'Time Log';
 //$scope.promo = 'The most popular books this month.';

 $scope.logs = [];

 $scope.addLog = function() {

  $scope.logs.push({
   project: $scope.project,
   phase: $scope.phase,
   date: $scope.date,
   startTime: $scope.startTime,
   intTime: $scope.intTime,
   endTime: $scope.endTime,
   comments: $scope.comments
  });

  // Clear input fields after push
  $scope.project = "";
  $scope.phase = "";
  $scope.date = "";
  $scope.startTime = "";
  $scope.intTime = "";
  $scope.endTime = "";
  $scope.comments = "";
 };

 $scope.deltaTime = function(logs) {

  return $scope.startTime - $scope.endTime;

  ;
 }
}]);

Answer 1

这样试试

$scope.deltaTime = function(logs) {
      return new Date($scope.startTime) - new Date($scope.endTime);
     }