Angular @Output Arbeits

Question

nicht

Der Versuch, mit @Output Ereignis-Emitter-Kind Mutter Kommunikation zu tun, aber nicht arbeiten hier ist das Kind Komponente

import { Component, OnInit, Output, Input, EventEmitter } from '@angular/core'; 

@Component({ 
    selector: 'app-emiter', 
    templateUrl: './emiter.component.html', 
    styleUrls: ['./emiter.component.css'] 
}) 
export class EmiterComponent implements OnInit { 

@Output() emitor: EventEmitter<any> 
    constructor() { this.emitor = new EventEmitter()} 

    touchHere(){this.emitor.emit('Should Work'); 
    console.log('<><><><>',this.emitor) // this comes empty 
    } 

    ngOnInit() { 
    } 

} 

diese HTML-Template

<p> 
<button (click)=" touchHere()" class="btn btn-success btn-block">touch</button> 
</p> 

Das ist console.log innerhalb der touchHier zeigt es nichts auch wenn ich dies in die Mutterkomponente einfügen, zeigt es auch nichts Elternkomponente

import { Component , OnInit} from '@angular/core'; 
// service I use for other stuff// 
    import { SenderService } from './sender.service'; 
// I dont know if I have to import this but did it just in case 
    import { EmiterComponent } from './emiter/emiter.component' 

@Component({ 
     selector: 'app-root', 
     templateUrl: './app.component.html', 
     styleUrls: ['./app.component.css'] 
    }) 
    export class AppComponent { 
     title = 'app'; 
     user: any; 
     touchThis(message: string) { 
     console.log('Not working: ${message}'); 
     } 
     constructor(private mySessionService: SenderService) { } 
    } 

und hier ist die HTML-Vorlage

<div> 
    <app-emiter>(touchHere)='touchThis($event)'</app-emiter> 
</div> 

Answer 1

Geordnete Komponente Vorlage:

<app-emitor>(emitor)='touchThis($event)'</app-emiter> 

In allen Templates @Output 'genannt', nicht das Kind Methode werden sollte.

Auch sehen: https://angular.io/guide/component-interaction#parent-listens-for-child-event

Answer 2

<app-emiter (emitor)="touchThis($event)" ></app-emiter> 

von @Output() Verwenden Sie den Fall, dass Sie in der Richtlinie des Emitters emittieren müssen gelten sollte den Namen der Variablen, die in der Richtlinie und aber das emittierte component.Adding Über Funktion innerhalb des Angebots vorbei an der $event.