Búsqueda de sitios web

angular - Convertir minutos a horas en un componente o pipe de angular2


En mi aplicación, almacenar el valor de la duración en minutos en el back-end y mostrar los datos en el front-end si el valor de la duración es inferior a 1 hora en minutos y el mismo valor es igual o superior a 1 hora en horas.

<strong *ngIf="event.eventDuration > 0 && event.eventDuration/60 < 1">{{event.eventDuration}} Minutes<br/></strong>
<strong *ngIf="event.eventDuration > 0 && event.eventDuration/60 >= 1">{{event.eventDuration/60}} Hour(s)<br/></strong>

¿Es esta la mejor manera o escribir una función de componente y devolver el valor desde la función? Además, las funciones de componente se llaman demasiadas veces si las llamamos desde un atributo de elemento.

Respuesta #1

Yo crearía una tubería así...

@Pipe({
  name: 'myTime'
})
export class MyTimePipe implements PipeTransform {
  transform(value: number): string {
     if(value > 0 && value/60 < 1) {
       return value + ' Minutes';

     } else {
       return value/60 + ' Hour(s)';
     }
  }
}

y úsalo en tu plantilla de la siguiente manera:

{{event.eventDuration | myTime}}

Respuesta #2

Otra manera sin usar PIPE

    transformMinute(value: number): string {
    let hours = Math.floor(value / 60);
    let minutes = Math.floor(value % 60);
    return hours + ' hrs ' + minutes + ' mins';
  }

en HTML

{{transformMinute(event.eventDuration)}}