console.log 在 Angular2 组件（Typescript）中不起作用

Question

我对 Angular2 和 typescript 都比较陌生。由于 typescript 是 javascript 的超集，我希望像 console.log 这样的函数能够工作。 console.log 在组件类外部时在 .ts 文件中完美运行，但在组件类内部却无法正常工作。

 // main.ts

import { Component } from '@angular/core';
console.log("Hello1"); //1. This works perfectly

@Component({..)
export class App {
 s: string = "Hello2";
 // console.log(s); //2. This gives compilation error (when uncommented)
 // Error: Function implementation is missing or not immediately following the declaration.
}

有什么我想念的吗？

原文由 Pranjal Mittal 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

它不起作用，因为 console.log() 它不在“App”类的“可执行区域”中。

类是由属性和方法组成的结构。

执行代码的唯一方法是将其放在将要执行的方法中。例如：构造函数（）

 console.log('It works here')

@Component({..)
export class App {
 s: string = "Hello2";

  constructor() {
    console.log(this.s)
  }
}

把类想象成一个普通的 javascript 对象。

期望这行得通是否有意义？

 class:  {
  s: string,
  console.log(s)
 }

如果您仍然不确定，请尝试 typescript playground，您可以在其中看到您的 typescript 代码生成为纯 javascript。

https://www.typescriptlang.org/play/index.html

原文由 Daniel Pliscki 发布，翻译遵循 CC BY-SA 4.0 许可协议