入力要素でangularjsフィルタを使用する

質問

私は、ドキュメントの中で明白な何かを見逃していなければいいのですが、もし見逃していたら、誰かが助けてくれると思います。

私は、日付フィールドを持つ DTO を返すために asp.net webapi を使用しています。これらは JSON.Net を使用してシリアル化されています (フォーマット '2013-03-11T12:37:38.693')。

INPUT要素でフィルタを使用したいのですが、これは可能ですか、それともこれを達成するために新しいフィルタまたはディレクティブを作成する必要がありますか？

// this just displays the text value
<input ui-datetime type="text" data-ng-model="entity.date" /> 
// this doesn't work at all
<input ui-datetime type="text" data-ng-model="{{entity.date|date:'dd/MM/yyyy HH:mm:ss a'}}" /> 
// this works fine
{{entity.date|date:'dd/MM/yyyy HH:mm:ss a'}}

私が見逃しているショートカットはありますか？

どのように解決するのですか？

簡単に言うと、ビューとモデルで異なる表現を持つデータを作成したい場合、ビューとモデルで異なる表現を持つための ディレクティブが必要です。 と考えることができます。 双方向フィルタ .

あなたのディレクティブは次のようになります。

angular.module('myApp').directive('myDirective', function() {
  return {
    require: 'ngModel',
    link: function(scope, element, attrs, ngModelController) {
      ngModelController.$parsers.push(function(data) {
        //convert data from view format to model format
        return data; //converted
      });

      ngModelController.$formatters.push(function(data) {
        //convert data from model format to view format
        return data; //converted
      });
    }
  }
});

HTMLです。

<input my-directive type="text" data-ng-model="entity.date" /> 

以下は、動作中の jsFiddle の例です。