Angular 2：在哪里指定额外的方法？

Question

我正在努力学习Angular2开发，请问基本问题。我使用 Angular-full-stack (https://github.com/angular-fullstack/generator-angular-fullstack) 来生成骨架应用程序。除此之外，它在 client/app/main 中预生成了 5 个文件：main.controller.js、main.controller.spec.js、main.html、main.js、main.scss

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

有一个构造函数和一些已经预定义的方法。但是，尝试访问这些或我从 main.html 添加的任何其他内容不起作用：

main.html

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

单击该按钮会出现以下控制台错误： "Uncaught ReferenceError: deleteThing is not defined"

如何或在哪里添加 his/her 自己的方法，然后以一种可以访问的方式添加？就此而言，main.js 应该包含什么？

Answer 1

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

参考： https://angular.io/guide/cheatsheet

Angular 2：在哪里指定额外的方法？

Angular 2: Where do I specify additional methods?

angular-fullstack

angular