2016-08-16 99 views
0

我有以下型號:角ngtable過濾器自定義屬性

function Row(a,b) { 
     this.a = a; 
     this.b = b; 

     this.sum = function() { 
      return (a+b).toFixed(2); 
     } 
    } 

行的列表被綁定到一個ngTable,我想創造的總和財產一個過濾器。

<table ng-table="myTable" show-filter="true" class="table table-responsive table-striped table-condensed text-center"> 
    <tr ng-repeat="row in filteredRows"> 
     <td data-title="'a'" sortable="'a'" filter="{ 'a': 'text' }"> 
     {{row.a}} 
     </td> 
     <td data-title="'b'" sortable="'b'" filter="{ 'b': 'text' }"> 
     {{row.b}} 
     </td> 
     <td data-title="'sum'" sortable="'sum()'" filter="{ 'sum()': 'text' }"> 
     {{row.sum()}} 
     </td> 
    </tr> 
    </table> 

這裏是整個代碼:https://embed.plnkr.co/VWUdn9an0kTUIFCkJWlj/

回答

1

爲了達到預期的結果,請使用以下選項

HTML:

<!DOCTYPE html> 
<html ng-app="plunker"> 

<head> 
    <meta charset="utf-8" /> 
    <title>AngularJS Plunker</title> 
    <script> 
    document.write('<base href="' + document.location + '" />'); 
    </script> 
    <link rel="stylesheet" href="style.css" /> 
    <script data-require="[email protected]" src="https://code.angularjs.org/1.4.12/angular.js" data-semver="1.4.9"></script> 
    <script src="ng-table.min.js"></script> 
    <script src="app.js"></script> 
</head> 

<body ng-controller="MainCtrl"> 
    <table ng-table="myTable" show-filter="true" class="table table-responsive table-striped table-condensed text-center"> 
    <tr ng-repeat="row in filteredRows"> 
     <td data-title="'a'" sortable="'a'" filter="{ 'a': 'text' }"> 
     {{row.a}} 
     </td> 
     <td data-title="'b'" sortable="'b'" filter="{ 'b': 'text' }"> 
     {{row.b}} 
     </td> 
     <td data-title="'c'" sortable="'c'" filter="{'c':'text'}"> 
     {{row.c}} 
     </td> 
    </tr> 
    </table> 
</body> 

</html> 

app.js:

var app = angular.module('plunker', ['ngTable']); 

app.controller('MainCtrl', function($scope,ngTableParams, $filter) { 
    //model 

    $scope.rows =[]; 
    var x =0; 

    function Row(a, b) { 
    this.a = a; 
    this.b = b; 

    this.sum = function() { 
     return (a + b).toFixed(2); 
    } 


    $scope.rows[x]= new lineItem(a,b,(a + b).toFixed(2)); 
    x++; 
    } 

    function lineItem(a,b,c){ 
    this.a = a; 
    this.b = b; 
    this.c =c; 

    } 

    $scope.lines = [new Row(1, 2), new Row(2, 3),new Row(4,30)]; 
    console.log($scope.rows); 

    $scope.myTable = new ngTableParams({ 
    count: $scope.rows 
    }, { 
    counts: [], // hides page sizes 
    total: $scope.rows.length, 
    getData: function($defer, params) { 
     //console.log(params); 
     $scope.filteredRows = params.sorting() ? $filter('orderBy')($scope.rows, params.orderBy()) : $scope.rows; 
     $scope.filteredRows = params.filter() ? $filter('filter')($scope.rows, params.filter()) : $scope.rows; 
     params.total($scope.filteredRows.length); 
     $defer.resolve($scope.filteredRows); 
    } 
    }); 
}); 

http://codepen.io/nagasai/pen/XKwOaZ

相關問題