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.

angular eventemitter

— LorenzoBerti
source

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});

— Pankaj Parkar
source

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.

— Andy Danger Gagné
source

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é.

— Adham Amiin
source

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);

— Khaled Dehia
source