Comment passer 2 paramètres à EventEmitter angular2


92

J'ai dans mon composant un EventEmittermais je ne peux pas le compiler car il renvoie l'erreur: Supplied parameters do not match any signature of call target

Mon composant:

@Output() addModel = new EventEmitter<any>();

saveModel($event, make, name) {
    this.addModel.emit(make, name);
}

Si je supprime l'un des paramètres, this.addModel.emit()cela fonctionne, mais oui: Puis-je passer 2 paramètres à mon eventEmitteret comment?

J'ai essayé aussi avec:

@Output() addModel = new EventEmitter<any,any>();

mais ça ne marche pas.

Réponses:


181

Si vous regardez la méthode de l' EventEmitterAPI emit, elle ne peut prendre qu'un seul paramètre de typeT

émettre (valeur?: T)

Étant donné qu'un seul paramètre est autorisé, envisagez de passer le paramètre comme dans la objectméthode d'émission. De même, la méthode makeet la namevariable ci-dessous conservent leurs valeurs respectives.

this.addModel.emit({make: make, name: name});
//shorthand is below
this.addModel.emit({make, name});

2
Oh, ok, merci! ce sera this.addModel.emit ({make: make, name: name});
LorenzoBerti

4
@echonax pas besoin de faire ça, es6 s'en chargera ici
Pankaj Parkar

comment puis-je observer / prendre cette valeur dans le composant parent?
roshini

@roshini s'il vous plaît jeter un oeil à la façon dont l' interaction des composants se produit, en gros vous devez émettre des données du composant enfant au composant parent en utilisant l' EventEmitterobjet ..
Pankaj Parkar

merci pour votre réponse, je connais cet émetteur entre les composants mais j'ai besoin d'interaction pour transmettre des données de directive à composant ..
roshini

41

Une autre option pour le saisir fortement est la suivante:

@Output addModel = new EventEmitter<{make: string, name: string}>();

vous pouvez ensuite l'émettre comme les spectacles @ Pankaj-Parkar

this.addModel.emit({make, name});
ou
this.addModel.emit({make: 'honda', name: 'civic'});

Vous avez maintenant une frappe forte au lieu d'utiliser objectou any.


22

Je l'ai réparé en faisant

EventEmitter<object>();

Ensuite, j'ai pu passer un objet tel que:

this.MyOutputVariable.emit({ name: 'jack', age: '12' });

Et ça a marché.


1
C'est super, Adham. Rien contre votre réponse, mais il convient de noter qu'une pratique standard - et une bonne pratique - consiste à toujours fournir un objet d'événement en tandem avec une ou plusieurs valeurs : publish(event, value)& subscribe(e, value) {...}. Je suis un peu surpris qu'Angular ait défini son interface / mis en œuvre comme il l'a fait.
Cody

1
Évalué à la baisse en faveur de solutions fortement types commenew EventEmitter<{name: string, age: number}>();
Liero

4

Je sais que c'est une vieille question pour moi, je créerais une interface et je l'enverrais en tant qu'objet où je pourrais avoir mon code plus organisé

 export interface addModelArgs{
      make:string,
      name:string
    }
@Output() addModel = new EventEmitter<addModelArgs>();

et appelez-le comme suit

    this.addModel.emit({make: 'honda', name: 'civic'});
or 
    let savParamters:addModelArgs={make: 'honda', name: 'civic'};

    this.addModel.emit(savParamters);
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.