如何使用过滤管道过滤列表时对特定值求和

时间:2017-02-09 00:04:44

标签: angular pipe

我有一些对象(发票),其中包含很少的字段。 姓名,日期,描述和金额税额和金额。

在上面包含所有发票的表格中,我有字段来过滤列表。 按字词搜索,将日期'日期设置为'设置日期'日期来自'。

在该表下,我有所有可见发票的amountPreTax和sum amountNet的可见总和。

在我过滤列表后将一些文本放入搜索字段或设置'date to'或'date from'并且列表越来越短,我希望更新的字段更新,因此它们只是可见发票的总和。 / p>

据我所知,我需要创建一个用于过滤发票的过滤器和另一个用于计算总和的过滤器 - 但我不知道如何写下来以及是否正确的方法:)

...

好的,到目前为止这些是我的过滤器(我知道,我需要将它们作为一个加入):

对于搜索字词:

import { Injectable, Pipe, PipeTransform } from '@angular/core';

@Pipe({
    name: 'invoicesFilter',
    pure: false
})
@Injectable()
export class FilterInvoices implements PipeTransform {
    transform(invoices: any[], term: any): any {
        if (invoices && term !== undefined) {
            return invoices.filter((invoice) => {
                return (
                    invoice.number.toLowerCase().indexOf(term.toLowerCase()) !== -1 ||
                    invoice.company.toLowerCase().indexOf(term.toLowerCase()) !== -1 ||
                    invoice.data.toLowerCase().indexOf(term.toLowerCase()) !== -1
                );
            });
        }
        return invoices;
    }
}

对于'date from':

import { Injectable, Pipe, PipeTransform } from '@angular/core';

@Pipe({
    name: 'dateFrom',
    pure: false
})
@Injectable()
export class FilterDatesFrom implements PipeTransform {
    transform(invoices: any[], date1: any, whichDates: number): any {
        var isDate1 = /(0[1-9]|[12][0-9]|3[01])\.(0[1-9]|1[012])\.(19|20)\d\d/.test(date1);
        if (invoices && isDate1) {
            date1 = date1 + '';
            date1 = date1.split('.');
            date1[0]=parseInt(date1[0]);
            date1[1]=parseInt(date1[1]);
            date1[2]=parseInt(date1[2]);
            return invoices.filter((invoice) => {
                var passDate1 = false;
                var passDate2 = false;
                var date3 = invoice.data;
                var date4 = invoice.datePost;
                date3 = date3.split('.');
                date3[0] = parseInt(date3[0]);
                date3[1] = parseInt(date3[1]);
                date3[2] = parseInt(date3[2]);
                date4 = date4.split('.');
                date4[0] = parseInt(date4[0]);
                date4[1] = parseInt(date4[1]);
                date4[2] = parseInt(date4[2]);
                if(whichDates == 2 || whichDates == 0){
                    if(date1[2]<date4[2]){
                        return invoice;
                    }
                    else if(date1[2]==date4[2])
                    {
                        if(date1[1]<date4[1])
                        {
                            return invoice;
                        }
                        else if(date1[1]==date4[1])
                        {
                            if(date1[0]<=date4[0]){
                                return invoice;
                            }
                        }
                    }
                }
                else if(whichDates == 1 || whichDates == 0){
                    if(date1[2]<date3[2]){
                        return invoice;
                    }
                    else if(date1[2]==date3[2])
                    {
                        if(date1[1]<date3[1])
                        {
                            return invoice;
                        }
                        else if(date1[1]==date3[1])
                        {
                            if(date1[0]<=date3[0]){
                                return invoice;
                            }
                        }
                    }
                }
            });
        }
        return invoices;
    }
}

和'约会'

import { Injectable, Pipe, PipeTransform } from '@angular/core';

@Pipe({
    name: 'dateTo',
    pure: false
})
@Injectable()
export class FilterDatesTo implements PipeTransform {
    transform(invoices: any[], date1: any, whichDates: any): any {
        var isDate1 = /(0[1-9]|[12][0-9]|3[01])\.(0[1-9]|1[012])\.(19|20)\d\d/.test(date1);
        if (invoices && isDate1) {
            date1 = date1 + '';
            date1 = date1.split('.');
            date1[0]=parseInt(date1[0]);
            date1[1]=parseInt(date1[1]);
            date1[2]=parseInt(date1[2]);
            return invoices.filter((invoice) => {
                var passDate1 = false;
                var passDate2 = false;
                var date3 = invoice.data;
                var date4 = invoice.datePost;
                date3 = date3.split('.');
                date3[0] = parseInt(date3[0]);
                date3[1] = parseInt(date3[1]);
                date3[2] = parseInt(date3[2]);
                date4 = date4.split('.');
                date4[0] = parseInt(date4[0]);
                date4[1] = parseInt(date4[1]);
                date4[2] = parseInt(date4[2]);
                if(whichDates == 2 || whichDates == 0){
                    if(date1[2]>date4[2]){
                        return invoice;
                    }
                    else if(date1[2]==date4[2])
                    {
                        if(date1[1]>date4[1])
                        {
                            return invoice;
                        }
                        else if(date1[1]==date4[1])
                        {
                            if(date1[0]>=date4[0]){
                                return invoice;
                            }
                        }
                    }
                }
                if(whichDates == 1 || whichDates == 0){
                    if(date1[2]>date3[2]){
                        return invoice;
                    }
                    else if(date1[2]==date3[2])
                    {
                        if(date1[1]>date3[1])
                        {
                            return invoice;
                        }
                        else if(date1[1]==date3[1])
                        {
                            if(date1[0]>=date3[0]){
                                return invoice;
                            }
                        }
                    }
                }
            });
        }
        return invoices;
    }
}

这是典型的对象(发票)结构:

{
    "_id": {
        "$oid": "588b2f345c5948001162fc15"
    },
    "number": "FV/004/12/16",
    "data": "12.12.2016",
    "datePost": "27.01.2017",
    "amountPreTax": 5347.43,
    "amountNet": 4347.5,
    "company": "Stacato Introligatorstwo Małgorzata Tomaszewska",
    "hasTax": "false",
    "orderId": "588a060ebe646d0011df997e",
    "orderNum": "00003",
    "clientNum": "010",
    "clientName": "Eurocasha",
    "isRevenue": false,
    "paid": true,
    "created": "2017-01-27T11:29:50.864Z",
    "file": null
}

我需要做两笔钱:“amountPreTax”和另一笔“amountNet”。

以下是我的html视图的一部分:

<tr *ngFor="
let invoice of invoices |
invoicesFilter:term |
dateFrom: date1:whichDates |
dateTo: date2:whichDates">

在此表中,我已迭代显示每张发票的数据。

在该表下,我需要显示amountPreTax和amountNet的总和 所以我可以像

一样显示它
{{sumNet | number : '1.2-2'}} zł
{{sumPreTax | number : '1.2-2'}} zł

0 个答案:

没有答案