Filtrar una variable en typescript

K

Kmos013 #1 Abr '18

Hola a todos, lo que quiero saber es como puedo hacer para filtrar por una variable el array, en este caso quiero que sea por anyo, ya que en el html tengo un desplegable con 2017 y 2018 y quiero que me muestre cuando pulso un anyo en concreto todos los datos que contengan ese año.

Cogido TS:

import { ControlEstadoMes } from "app/core/api/control-horas/control-estado-mes.model";
import { ControlEstadoMesService } from "./control-estado-mes.service";
import { Observable } from "rxjs/Observable";
import { of } from "rxjs/observable/of";
import { IControlEstadoMesService } from "./control-estado-mes.interface";
import { Injectable } from "@angular/core";

export const MOCK_CONTROLESTADOMES: ControlEstadoMes[] = [
    { id: 0, mes: "Enero", anyo: 2017, bloqueado: true },
    { id: 1, mes: "Febrero", anyo: 2017, bloqueado: true },
    { id: 2, mes: "Marzo", anyo: 2017, bloqueado: true },
    { id: 3, mes: "Abril", anyo: 2017, bloqueado: true },
    { id: 4, mes: "Mayo", anyo: 2017, bloqueado: true },
    { id: 5, mes: "Junio", anyo: 2017, bloqueado: true },
    { id: 6, mes: "Julio", anyo: 2017, bloqueado: true },
    { id: 7, mes: "Agosto", anyo: 2017, bloqueado: true },
    { id: 8, mes: "Septiembre", anyo: 2017, bloqueado: true },
    { id: 9, mes: "Octubre", anyo: 2017, bloqueado: true },
    { id: 10, mes: "Noviembre", anyo: 2017, bloqueado: true },
    { id: 11, mes: "Diciembre", anyo: 2017, bloqueado: true },
    { id: 12, mes: "Enero", anyo: 2018, bloqueado: true },
    { id: 13, mes: "Febrero", anyo: 2018, bloqueado: true },
    { id: 14, mes: "Marzo", anyo: 2018, bloqueado: true },
    { id: 15, mes: "Abril", anyo: 2018, bloqueado: false },
    { id: 16, mes: "Mayo", anyo: 2018, bloqueado: false },
    { id: 17, mes: "Junio", anyo: 2018, bloqueado: false },
    { id: 18, mes: "Julio", anyo: 2018, bloqueado: false },
    { id: 19, mes: "Agosto", anyo: 2018, bloqueado: false },
    { id: 20, mes: "Septiembre", anyo: 2018, bloqueado: false },
    { id: 21, mes: "Octubre", anyo: 2018, bloqueado: false },
    { id: 22, mes: "Noviembre", anyo: 2018, bloqueado: false },
    { id: 23, mes: "Diciembre", anyo: 2018, bloqueado: false }
]

@Injectable()
export class ControlEstadoMesServiceMock implements IControlEstadoMesService {
getControlEstadoMes(/*value: number*/): Observable<ControlEstadoMes[]> {
        return of(MOCK_CONTROLESTADOMES);/*.filter(anyo == value);*/
    }
}

HiGher #2 Abr '18

Pero si lo tienes abajo. filter acepta como primer argumento una función, a la cual se llama en cada iteración de la colección con el elemento como primer argumento. Deberías cambiar la condición

year == value

por una función como

function (item) { return item.year === value; }

o

({ year }) => year === value

.

PD: No uses

==

en comparaciones en Javascript nunca, a no ser que quieras comprobar si una variable es

null

o

undefined

1 respuesta

K

Kmos013 #3 Abr '18

#2 Me salta el siguiente error:

Class 'ControlEstadoMesServiceMock' incorrectly implements interface 'IControlEstadoMesService'. Types of property 'getControlEstadoMes' are incompatible.

1 respuesta

HiGher #4 Abr '18

#3 A ver el código

1 respuesta

K

Kmos013 #5 Abr '18

#4

import { ControlEstadoMes } from "app/core/api/control-horas/control-estado-mes.model";
import { ControlEstadoMesService } from "./control-estado-mes.service";
import { Observable } from "rxjs/Observable";
import { of } from "rxjs/observable/of";
import { IControlEstadoMesService } from "./control-estado-mes.interface";
import { Injectable } from "@angular/core";
import { element } from "protractor";

export const MOCK_CONTROLESTADOMES: ControlEstadoMes[] = [
    { id: 0, mes: "Enero", anyo: 2017, bloqueado: true },
    { id: 1, mes: "Febrero", anyo: 2017, bloqueado: true },
    { id: 2, mes: "Marzo", anyo: 2017, bloqueado: true },
    { id: 3, mes: "Abril", anyo: 2017, bloqueado: true },
    { id: 4, mes: "Mayo", anyo: 2017, bloqueado: true },
    { id: 5, mes: "Junio", anyo: 2017, bloqueado: true },
    { id: 6, mes: "Julio", anyo: 2017, bloqueado: true },
    { id: 7, mes: "Agosto", anyo: 2017, bloqueado: true },
    { id: 8, mes: "Septiembre", anyo: 2017, bloqueado: true },
    { id: 9, mes: "Octubre", anyo: 2017, bloqueado: true },
    { id: 10, mes: "Noviembre", anyo: 2017, bloqueado: true },
    { id: 11, mes: "Diciembre", anyo: 2017, bloqueado: true },
    { id: 12, mes: "Enero", anyo: 2018, bloqueado: true },
    { id: 13, mes: "Febrero", anyo: 2018, bloqueado: true },
    { id: 14, mes: "Marzo", anyo: 2018, bloqueado: true },
    { id: 15, mes: "Abril", anyo: 2018, bloqueado: false },
    { id: 16, mes: "Mayo", anyo: 2018, bloqueado: false },
    { id: 17, mes: "Junio", anyo: 2018, bloqueado: false },
    { id: 18, mes: "Julio", anyo: 2018, bloqueado: false },
    { id: 19, mes: "Agosto", anyo: 2018, bloqueado: false },
    { id: 20, mes: "Septiembre", anyo: 2018, bloqueado: false },
    { id: 21, mes: "Octubre", anyo: 2018, bloqueado: false },
    { id: 22, mes: "Noviembre", anyo: 2018, bloqueado: false },
    { id: 23, mes: "Diciembre", anyo: 2018, bloqueado: false }
]

@Injectable()
export class ControlEstadoMesServiceMock implements IControlEstadoMesService {
getControlEstadoMes(value: number): Observable<ControlEstadoMes[]> {
        let meses = MOCK_CONTROLESTADOMES.filter(element => element['anyo'] === value); 
        return of(meses);
    }
}

1 respuesta

HiGher #6 Abr '18

#5 No se hasta dónde llegará la inferencia de tipos de TypeScript. Por si acaso, prueba a declararlos explícitamente:

let meses: ControlEstadoMes[]  = MOCK_CONTROLESTADOMES.filter((element: ControlEstadoMes): boolean => (element['anyo'] === value));

Filtrar una variable en typescript

Usuarios habituales

Tags