eckig 2 Ereignis-Listener auf Parent wird nicht vom Kind-emittierten Ereignis aufgerufen

Ich habe mein Projekt mit der Angular 2 quickstart eingerichtet. Dann habe ich die folgenden Komponenten, versuchen, ein ähnliches Muster folgen as here:eckig 2 Ereignis-Listener auf Parent wird nicht vom Kind-emittierten Ereignis aufgerufen

main.ts:

import { bootstrap } from '@angular/platform-browser-dynamic'; 

import { AppComponent } from './app.component'; 

bootstrap(AppComponent);

app.component.ts:

import { Component } from '@angular/core'; 
import { MenuComponent } from './menu.component'; 

@Component({ 
    selector: 'my-app', 
    template: `<menu (onToggleEvent)="onToggle($event)"></menu>`, 
    directives: [ MenuComponent ] 
}) 
export class AppComponent { 
    onToggle(data) { 
     console.log(data); 
    } 
}

menu.component.ts:

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

@Component({ 
    selector: 'menu', 
    template: `<button (click)="toggleMe()">Toggle Me</button>` 
}) 
export class MenuComponent { 
    @Output onToggleEvent = new EventEmitter(); 

    public toggleMe(): void { 
     this.onToggleEvent.emit('test'); 
    } 
}

index.html:

<html> 
    <head> 
     <title>My page</title> 
     <meta charset="UTF-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1"> 
     <link rel="stylesheet" href="styles.css"> 

     <!-- 1. Load libraries --> 
     <!-- Polyfill(s) for older browsers --> 
     <script src="node_modules/es6-shim/es6-shim.min.js"></script> 

     <script src="node_modules/zone.js/dist/zone.js"></script> 
     <script src="node_modules/reflect-metadata/Reflect.js"></script> 
     <script src="node_modules/systemjs/dist/system.src.js"></script> 

     <!-- 2. Configure SystemJS --> 
     <script src="systemjs.config.js"></script> 
     <script> 
      System.import('app').catch(function(err){ console.error(err); }); 
     </script> 
    </head> 

    <!-- 3. Display the application --> 
    <body> 
     <my-app>Loading...</my-app> 
    </body> 
</html>

Wenn ich debuggen, toggleMe() ausführt und das Ereignis wird ausgesendet, aber die onToggle() Methode wird nie aufgerufen. Irgendwelche Gedanken, warum?

Quelle

2016-05-22 Daniel Allen

Den Fehler gefunden - ich hatte keine Klammern neben der @Output Annotation. Ich verwendete den einfachen Server, der im Angular QuickStart enthalten ist, der BrowserSync und einen TypeScript-Watcher verwendet, um während der Übertragung zu transponieren. Irgendwie wurde das Hinzufügen von nur @Output anstelle von @Output() nie von dem Transpiler abgefangen, und dies scheiterte im Stillen. Nachdem ich den Server gestoppt und versucht habe, den Server neu zu starten (was die Übertragung ausgelöst hat), wurde der Fehler ausgelöst, der mich in den Fehler einweihte.

Quelle

2016-05-22 04:31:52

eckig 2 Ereignis-Listener auf Parent wird nicht vom Kind-emittierten Ereignis aufgerufen

Antwort

Verwandte Themen