Angular2 - テンプレート内でプライベート変数にアクセスできるようにする必要がありますか? 質問する

Angular2 - テンプレート内でプライベート変数にアクセスできるようにする必要がありますか? 質問する

変数がprivateコンポーネント クラスで宣言されている場合、そのコンポーネントのテンプレートでその変数にアクセスできるようになりますか?

@Component({
  selector: 'my-app',
  template: `
    <div>
      <h2>{{title}}</h2>
      <h2>Hello {{userName}}</h2> // I am getting this name
    </div>
  `,
})
export class App {
  public title = 'Angular 2';
  private userName = "Test Name"; //declared as private
}

ベストアンサー1

上院

Angular 14以降では可能protectedテンプレート内のコンポーネント メンバーをバインドします。これにより、内部状態 (テンプレートからのみアクセス可能) をコンポーネントのパブリック API として公開するという懸念が部分的に解決されます。


いいえ、テンプレートではプライベート変数を使用しないでください。

私はドリュームーアの答え概念的には完璧だと思っても、実装的には間違っています。テンプレートはコンポーネントクラス内ではなく、コンポーネントクラスの外に存在します。このレポ証明のために。

これが機能する唯一の理由は、TypeScriptのprivateキーワードが実際にはメンバーをプライベートにしないからです。ジャストインタイムコンパイルは実行時にブラウザで行われ、JSにはプライベートメンバーの概念がありません(まだ?)。サンダー・エリアス私を正しい道に導いてくれてありがとう。

ngcと事前コンパイルを使用すると、テンプレートからコンポーネントのプライベートメンバーにアクセスしようとするとエラーが発生します。デモリポジトリをクローンし、メンバーの可視性をプライベートに変更するとMyComponent、実行時にコンパイルエラーが発生しますngc。また、答えAhead-of-Time コンパイルに特化しています。

おすすめ記事