web-dev-qa-db-ja.com

Angular2 TypeScriptのコメント（アウト）コード

次のAngular2 TypeScriptコードがあり、Javascriptの規則に従ってセクションがコメント化されています。

@Component({
    selector: 'my-app',
    template:
    `<h1>{{title}}</h1>
    <h2>{{lene.name}}</h2>
    <div><label>id: </label>{{lene.id}}</div>
    /*<div>
       <label>name: </label>
       <input [(ngModel)]="lene.name" placeholder="name">
    </div>*/`
    <div><label>description: </label>{{lene.description}}</div>
})

ただし、TypeScriptがJavascriptにコンパイルされると、Webブラウザーに次の出力が表示されます。

Browser image

APIドキュメントを検索しましたが、この非常に基本的な機能の構文を指定するエントリが見つかりません。 TypeScriptで複数行のコメントを行う方法を知っている人はいますか？

javascriptangularjsangularcomments
7
Peter David Carter

/* */はTypeScriptコメント区切り文字です

文字列リテラル内では機能しません。

代わりにHTMLコメント構文を使用できます<!-- -->。

@Component({
    selector: 'my-app',
    template:
    `<h1>{{title}}</h1>
    <h2>{{lene.name}}</h2>
    <div><label>id: </label>{{lene.id}}</div>
    <!-- <div>
       <label>name: </label>
       <input [(ngModel)]="lene.name" placeholder="name">
    </div> -->'
    <div><label>description: </label>{{lene.description}}</div>
})

この方法でコメントアウトされたHTMLは、コメントとしてのみDOMに追加されます。

18
Günter Zöchbauer

テンプレートを使用している場合は、HTMLコメント<!-- ... -->：

@Component({
  selector: 'my-app',
  template: `
    <h1>{{title}}</h1>
    <h2>{{lene.name}}</h2>
    <div><label>id: </label>{{lene.id}}</div>
    <!-- div>
      <label>name: </label>
      <input [(ngModel)]="lene.name" placeholder="name">
    </div-->
    <div><label>description: </label>{{lene.description}}</div>
  `
})
3
Thierry Templier

ただし、コメントセクション内でTypeScriptコードを実行しようとしている間はHTMLを非表示にするだけなので、動作していないようです。

0
hannodb