入力内のモデル値の変換

Question

inputの値を変換しようとしています。ユーザーがテキストボックスにテキストを入力できないように入力を無効にする必要があります。データはng-modelを使用して入力され、現在は以下のように見えます。

<input ng-model="reason" ng-disabled="true" type="text" class="form-control" name="reason"> 

私はまた、次の試してみた：

<input ng-model="reason|translate" ng-disabled="true" type="text" class="form-control" name="reason"> 
<input ng-model="{{ reason | translate}}" ng-disabled="true" type="text" class="form-control" name="reason"> 

をそれらのどれも働きました。

コントローラの値を変換できますが、htmlタグでこれを行いたいので、スコープの実際の値は変更されません。 これをどうすれば実現できますか？

Answer 1

私はこの例で作業しました。翻訳したいはいまたはいいえの値の入力について考えてみましょう。あなたのテンプレートに一方通行のデータバインディングを試してみてください：

<input value="{{ answer | translate }}" 
    type="text" class="form-control" name="answer" 
    (change)="answerChanged($event)"> 

あなたも値を更新したい場合は、コンポーネントの変化を聞く：

answerChanged(Event event) { 
     this.answer = event.target.value.toUpperCase(); 
    } 

国際化ファイルについて。

en.json：

{ 
    "YES": "Yes", 
    "NO": "No" 
} 

fr.json：

{ 
    "YES": "Oui", 
    "NO": "Non" 
} 

Plunker：

http://plnkr.co/edit/BeYBAWG57eIZOU3KdBCD

Answer 2

あなたが代わりにHTML入力の入力のためのNG-値を使用することができます>値。次に、簡単に翻訳できます：

<input ng-value="ctrl.reason | translate" ng-model="ctrl.reason">