es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

Comprobación de Tipos en Componentes que implementan una Interfaz

11 Jul, 2023 Programación

En Angular, quiero especificar el tipo para un componente que implementa una determinada interfaz que paso a una clase.

Ejemplo:
La clase A tiene esta firma:

class A {
constructor(public component: ?) {}
}

Luego declaramos una interfaz I:

export interface I<T> {
setData(data: T): void;
}

El componente B implementa la interfaz I:

class B implements I<string> {
setData(data: string) { ... }
}

Ahora el problema es que no solo el componente B implementa la interfaz I, sino también los componentes C, D y E. Además, la clase A debería poder procesar los componentes B, C, D y E, es decir, todos los componentes que implementan la interfaz I.
¿Puedo especificar en la clase A que el tipo del componente es cualquier componente que implementa la interfaz I? Mi solución actual es:

component: any

Pero me gustaría especificar que puede ser cualquier componente con la restricción de que implemente I.

¿Hay alguna otra forma de hacerlo?

Tags:  , , , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Sí, puedes usar un parámetro de tipo genérico en la clase A para especificar que el componente debe implementar la interfaz I. Aquí está la firma actualizada de la clase A:

    class A<t extends=""></t><any>> {
  constructor(public component: T) {}
}

    El parámetro de tipo genérico T extiende de la interfaz I, lo cual significa que cualquier componente pasado a la clase A debe implementar la interfaz I. El parámetro de tipo I<any> especifica que la función setData de la interfaz I puede aceptar cualquier tipo de dato.

    Ahora, puedes crear instancias de la clase A con cualquier componente que implemente la interfaz I:

    const b = new B();
const c = new C();

const a1 = new A<b>(b); // Se acepta el componente B
const a2 = new A<c>(c); // Se acepta el componente C

    Cualquier componente que no implemente la interfaz I será rechazado:

    typescript
    const d = new D();
    const a3 = new A<d>(d); // Error: El componente D no implementa la interfaz I

Comments are closed.