2016-06-10 15 views
0

Ich arbeite hart an der Entwicklung von Angular 2, also entschuldige die Grundfrage. Ich habe Angular-full-stack (https://github.com/angular-fullstack/generator-angular-fullstack) verwendet, um eine Skelett-App zu erstellen. Unter anderem ist es vorge erzeugt 5 Dateien in Client/app/main: main.controller.js, main.controller.spec.js, main.html, main.js, main.scssAngular 2: Wo gebe ich zusätzliche Methoden an?

main.controller Js

'use strict'; 

(function() { 

    class MainController { 

    constructor($http) { 
     this.$http = $http; 
     this.awesomeThings = []; 
    } 

    $onInit() { 
     this.$http.get('/api/things') 
     .then(response => { 
      this.awesomeThings = response.data; 
     }); 
    } 

    addThing() { 
     if (this.newThing) { 
     this.$http.post('/api/things', { 
      name: this.newThing 
     }); 
     this.newThing = ''; 
     } 
    } 

    deleteThing(thing) { 
     this.$http.delete('/api/things/' + thing._id); 
    } 
    } 

    angular.module('orbitApp') 
    .component('main', { 
     templateUrl: 'app/main/main.html', 
     controller: MainController 
    }); 
})(); 

Es gibt ein Konstruktor und einige Methoden bereits vordefiniert. Allerdings versuchen, diese oder andere ich von main.html hinzufügen zuzugreifen funktioniert nicht:

main.html

... 
<button onclick="deleteThing()">Test: deletething</button> 
... 

Klick auf die Schaltfläche gibt die folgende Konsole Fehler: „Uncaught Reference : deleteThing ist nicht definiert "

Wie oder wo fügt man seine eigenen Methoden hinzu, so dass man darauf zugreifen kann? Was soll eigentlich in main.js gehen?

Antwort

2
<button (click)="deleteThing()">Test: deletething</button> 

Referenz: https://angular.io/guide/cheatsheet

+0

Es machte den Fehler gehen weg, aber die Schaltfläche klicken nicht alles tun. Schätze, da muss auch noch etwas anderes sein. –