thedbogh
thedbogh

Reputation: 634

How can I represent file size in a human readable way in Angular 6?

Let's assume that I have in html *ngFor="let cell of dateFormat(row)">{{cell | filesize}}</td> and dateFormat looks in this way

dateFormat(row:string){

    var today = new Date(row[4]);

    let latest_date = this.datepipe.transform(today, 'yyyy-MM-dd');

    row['4'] = latest_date;

    return row;

}

HTML:

<tr *ngFor="let row of this.UploaderService.tableData2.dataRows">
    <td [ngClass]="{'active': check(row) }" (click)="listClick($event, row)"
       (dblclick)="listDoubleClick($event, row)"
       *ngFor="let cell of dateFormat(row)">{{cell}}
    </td>
</tr>

Is there any way to call filesize only on row['2']? At the moment filesize works properly however it formats all of the rows. I tried in dateFormat but I am not sure how can i use filesize in typescript . Something like this

let latest_date = this.datepipe.transform(today, 'yyyy-MM-dd');

row['4'] = latest_date;
row['2'] = here convert row['2'] using filesize;

return row;

Any ideas?

Upvotes: 4

Views: 7007

Answers (2)

Ponsakthi Anand
Ponsakthi Anand

Reputation: 345

npm install ngx-filesize

In your module:

import {NgxFilesizeModule} from 'ngx-filesize';



// ...

@NgModule({
    // ...
    imports: [
        // ...
        NgxFilesizeModule,
        // ...
    ]
    // ...
})

In Your component

{{bytes | filesize}}

*I know this solution waa a late reply but it could help for upcoming developers :)

Upvotes: 5

HDJEMAI
HDJEMAI

Reputation: 9800

I don't have all of your code, so I'm creating an example with just dummy data,

so you can do something like this:

*ngFor="let cell of dataRows">{{(row == 2)? (row | filesize): row }}

For a demo, refere to this stackblitz

In this case, the filesize will be applied only when row == 2

Upvotes: 1

Related Questions