angle2-バクテリアオペレータを使って作られた文字列内の補間

Question

私はangular2を学んでいます。

ChromeブラウザのScratchJS拡張機能を使用してTypeScriptを学習しました。 （私はそのように置くことができるならば）これは私がbactic文字列のためにしたもので、ことをやっている間

let user='user'; 
let msg=`Welcome ${user}! 
I can write multi-line string. 

This is awesome! 
`; 
console.log(msg); 

あなたが見ることができるように、これは、変数、ユーザーが文字列で使用される方法です。しかし、私がAngular2プロジェクトで同じことをすると、少し違っています（上記のようなことをするとエラーになります）。私のdumy Angular2プロジェクトでは、単純なコンポーネントを作った。

import { Component} from '@angular/core'; 

@Component({ 
    selector: 'app-user', 
    template: ` 

     Hi, {{user}} 

     I can write multi-line string. 

     This is awesome! 
    `, 
    styles: [] 
}) 
export class UserComponent { 

    user:string='John Doe'; 
    constructor() { 
    } 
} 

これは機能します。しかし、ここで、私は

{{}} 

代わりの

${} 

を使用して文字列の補間を使用していると私はそれを使用している場合、それはエラーがスローされます。 私はいくつかの事実が間違っていることを理解しています。しかし誰もそれが何であるか説明できますか？

ありがとうございます！

N.B：私はAngular2と活字体

Answer 1

{{ foo }}の最新バージョンを使用していることはあなたのクラスで定義されたfooプロパティを結合、Angularのテンプレートエンジンによって処理されます。

${ bar }は、レンダリング中にオブジェクトのbarというプロパティが何であるかの手がかりがないJavascript string interpolationによって処理されます。

これはAngularの動作に密接に関連しています。これはtypescriptやその他のものとは関係ありません。 Angularプロジェクトに参加していない場合や、テンプレートにない場合は、${}を引き続き使用できます。

は例えば、このようなものは、式が返される前に評価されているので、仕事、およびテンプレートエンジンの依存ではないはずです。

public getUsername(): string { 
    let username = 'test'; 
    return `Hi ${username}`; 
}