angular - Angular 2で単純なテキスト入力バインドを行うには?

Question

Angular2コンポーネントからテンプレートへの単純なバインドを試みています。私のテンプレートコードは次のようになります...

<textarea class="left-side" #newLeft (keyup)="enterLeftText($event, newLeft)"></textarea>

<textarea class="right-side">{{leftText}}</textarea>

次に、私のコンポーネントには次のものがあります...

enterLeftText($event, newLeft) {
  this.leftText = newLeft.value;
}

問題は、newLeft が常に未定義であることです。私は何が欠けていますか？

score 9 · Accepted Answer

#idバインドに大文字を使用できないように見えるため、興味深いバグが見つかりました。

に置き換えるだけnewLeftでnewleft問題が解決します。

UPDATE : 実際、属性をバインドするときの Angular 1 の場合と同様に、id にはダッシュ記号を付け、変数はキャメルケースにする必要があるようです。

したがって、あなたの問題に対する本当の答えは、次のように書くこと#new-leftです：

<textarea class="left-side" #new-left (keyup)="enterLeftText($event, newLeft)"></textarea>

score 0 · Accepted Answer

「#new-left」を使用すると例外が発生する

例外: エラー: キャッチされていません (約束されています): テンプレート解析エラー: 変数名に「-」は使用できません

キャメルケースの変数名を使用したソリューションは、今ではうまく機能します。

2 に答える 2