从视图中获取过滤后的值到控制器

时间:2018-04-19 08:46:45

标签: angularjs

我使用ng-repeat来显示我的对象数组。其中一个属性是视频持续时间,我使用过滤器直接显示所有meta_duration的总和。这里是过滤器

app.filter('sumProduct', function() {
 return function (input) {
  var i = input instanceof Array ? input.length : 0;
  var a = arguments.length;
  if (a === 1 || i === 0)
      return i;

  var keys = [];
  while (a-- > 1) {
      var key = arguments[a].split('.');
      var property = getNestedPropertyByKey(input[0], key);
      if (isNaN(property))
          throw 'filter sumProduct can count only numeric values';
      keys.push(key);
  }

  var total = 0;
  while (i--) {
      var product = 1;
      for (var k = 0; k < keys.length; k++)
          product *= getNestedPropertyByKey(input[i], keys[k]);
      total += product;
  }
  return total;

  function getNestedPropertyByKey(data, key) {
    for (var j = 0; j < key.length; j++)
        // data = dataDuration[key[j]];
        data = data.meta_duration;;
    return data;
}
}
})

并在视野中

<table>
    <thead>
    <tr>
        <th>Media name</th>
        <th>Media type</th>
        <th>Media duration in sec</th>
        <th>Media thumbnail</th>
    </tr>
</thead>
<tbody>
    <tr ng-repeat="media in myMediaItems">

        <td>{{media.name}}</td>
        <td>{{media.type}}</td>
        <td>>{{media.meta_duration}}</td>
        <td><img src="{{media.thumbnail}}" alt="" /></td>
    </tr>

</tbody>
<tr>
    <td></td>
    <td></td>
    <td>Total duration {{ myMediaItems|sumProduct:'duration' }}</td> //here is where i use custom filter
    <td></td>

</tr>
</table>

如何在控制器中获取总持续时间值? 动态地我将媒体添加(推送)到具有所有媒体的另一列表中的列表。

 $scope.addToMediaList = function(item) {
          var seconds = parseInt(item.meta_duration);
          $scope.view_duration = Math.floor(moment.duration(seconds,'seconds').asHours()) + ':' + moment.duration(seconds,'seconds').minutes() + ':' + moment.duration(seconds,'seconds').seconds();($scope.view_duration_seconds, "HH:mm:ss");
          $scope.myMediaItems.push(item);
          $scope.sumDuration = $filter("sumProduct")(myMediaItems.meta_duration); //i try like this, set on $scope.sumDuration but in conole i get only number 0
          $scope.myMediaItemsId.push(item.id);
          $scope.input = "";
        };

由于

3 个答案:

答案 0 :(得分:1)

我简化了过滤器。

试试这个

app.filter('sumProduct', function() {
   return function (input) {
     var i = input instanceof Array ? input.length : 0;
     var a = arguments.length;
     if (i === 0)
       return i;
     var total = 0;
     for(var x of input){
       var duration = parseFloat(x.meta_duration);
       if(isNaN(duration)){
           throw 'filter sumProduct can count only numeric values';
       }
       total += duration;
    }
    return total;
  }
});

答案 1 :(得分:0)

你可以使用这样的东西

<div ng-init="sumDuration = myMediaItems|sumProduct:'duration'"> </div>

答案 2 :(得分:0)

我通过将自定义过滤器的返回值转发给控制器来解决这个问题。

var filtered = $filter('sumProduct')($scope.myMediaItems); 
          console.log(filtered)

过滤后的价值是总和。 thnx @Amaya San