console.logがAngular2で機能しないComponent（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. 
} 

紛失しているものはありますか？

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

それでもわからない場合は、無地のJavaScriptに生成されたあなたのtypescriptですコードを見ることができtypescriptです遊び場を試してみてください。 console.logが関数内にラップする必要があります

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

Answer 2

、すべてのクラスのための「デフォルト」機能は、そのconstructorあるので、そこに宣言する必要があります。

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

@Component({ 
    selector: 'hello-console', 
}) 
    export class App { 
    s: string = "Hello2"; 
    constructor(){ 
    console.log(s); 
    } 

} 

Answer 3

最新のブラウザが必要なため、ブラウザを更新してみてください。 チェック：https://angular.io/guide/browser-support

最新のブラウザを更新した後、console.logの問題が修正されました。