Estoy tratando de especificar los tipos de todos mis métodos/parámetros, así que en lugar de:
someCoolFunction(param) { ... }Intento usar la versión type safe'ish de esta manera:
someCoolFunction(param: number): void { ... }Cuando reboto entre los tipos que he declarado yo mismo, es fácil. Cuando se trata de tipos traídos de otros paquetes, a menudo también sé cuáles son, ya que especifico explícitamente mis importaciones.
Sin embargo, no estoy seguro de qué tipo dar al evento, al objeto y al resultado en el método a continuación.
someBoundFunction(event, junk) { ... return {a: 1, b: 2}; } He visto que se usa any , pero no estoy seguro de si es aplicable en este caso. Además, siento que es incorrecto para la llamada de evento. (Si es importante, el enlace de la llamada a la función puede verse como se muestra a continuación).
<custom-thing (output)="someBoundFunction($event, {x:"x",y:"y"})">!</custom-thing>'cualquiera' está bien porque la función someBoundFunction en la plantilla se vincula dinámicamente (a través del analizador de plantillas angular2), por lo que TS no sabe el tipo (TS no analiza las plantillas, angular2 las analiza dinámicamente).
Por supuesto, para 'aclarar visualmente' puede usar someBoundFunction(event: SomeType, junk: any): any de los mismos que usa en @Output() output: EventEmitter<SomeType> = new EventEmitter(); (en el componente personalizado), pero el analizador TS no lo verificará (debido a que no se puede analizar y vincular la función en la plantilla). Puede usar 'cualquiera' como tipo de devolución de alguna función someBoundFunction porque no definió el tipo de objeto {a: 1, b: 2} como clase separada (sino como objeto creado dinámicamente), y la misma situación es para {x:"x",y:"y"} .
=== EDITAR ===
@AluanHaddad en los comentarios a continuación, bríndeme información nueva sobre TS (gracias) que no conozco antes, por lo que la nueva versión de mi respuesta es:
Defina la interfaz (o clase) de datos de outputData (porque se usará dos veces: en la emisión de eventos y en el manejo de eventos), por ejemplo:
export interface OutputData { a: string; b: number; } Luego, en su componente custom-thing evento:
@Output() public output = new EventEmitter<OutputData>();Y evento de incendio:
this.output.emit({a:'test', b:2}); Y luego puede definir el controlador de eventos someBoundFunction de esta manera:
public someCoolFunction(event: OutputData, junk: {a: string, b:string}) : { a: number, b: number} { // ... return { a: 1, b:2}; } Y debido a que devuelve algún objeto en someCoolFunction , supongo que desea reutilizar esta función en otra parte del código, por lo que puede invocarla (si no desea reutilizar este controlador, no es necesario definir el tipo junk y el tipo de retorno) :
let result = this.someCoolFunction({ a: 'test', b: 666}, { a:1, b:'zz'}); console.log(result.a); // ... Y ahora tiene un código tipificado bastante fuerte (excepto en la plantilla de verificación de tipo someCoolFunction ).
Puede que no entienda bien tu pregunta, pero en este caso el tipo de $event puede variar. $event es solo un proxy para cualquier cosa que se transmita a través del método emit en custom-thing .
Por ejemplo, si tuviera una salida en mi componente llamada output .
@Output() output: EventEmitter<number> = new EventEmitter<number>(); emitEvent() { this.output.emit(5); // $event is 5 of type number }