短い質問:
<input type="text">
文字列を編集するとモデルが更新され、その逆の方法で、オブジェクトのカスタム形式の文字列シリアル化を含むを作成する方法は?
AngularJS のディレクティブが最適だと思いますが、固定できません。
長い質問:
前編
アプリケーションの「マスター モデル」であるオブジェクトがあります。特定の形式の文字列にシリアル化できます。
2 ~ 3 個の属性があり、そのシリアル化は「;」で結合されます。(3 番目が欠落している場合、末尾の「;」はありません)
属性 2 と 3 はオブジェクトのリストで、これらを「,」で結合してシリアライズします。
オブジェクトのシリアライゼーションは、文字列属性の 1 つにすぎないか、間に「x」を挟んで 2 つになります。
だから私はコンストラクタ(スペック文字列を受け入れる)とtoString
関数を持っています。続く; 明確にするために後者:
World.prototype.toString = function() {
var spec = [];
spec[0] = this.version;
spec[1] = this.layers.map(function(layer) {
var c = (layer.c > 1) ? layer.c + 'x' : '';
return c + layer.id; //e.g. 'T' or '2xT'
}).join(',');
//spec[2] in python: ','.join(option.id for option in options if option.checked)
var options = this.options.filter(function(option) {
return option.checked;
});
if (options.length > 0)
spec[2] = options.map(function(option) {
return option.id;
}).join(',');
return spec.join(';');
};
私が使用しようとしたディレクティブはこのように見えますが、$watch
一度だけ起動します。
angular.module('layersApp', []).directive('spec', function() {
return {
restrict: 'A',
link: function(scope, element, attrs) {
scope.$watch('world', function(val) {
element.val(val.toString());
console.log('object updated', element.val());
}, true);
element.blur(function(e) {
scope.world = new World(element.val());
});
}
};
});
実際の長い質問
私が欲しいのは、これを機能させる簡単な方法です。
<input type="text" data-ng-model="theWorld" spec>
上記のカスタムディレクティブはどこにspec
あり、双方向バインディングを設定しています
見通し
これにより、一般的な「シリアライゼーション」ディレクティブが次のように使用されるようになると、すばらしいことです。
<input type="text" data-serialization="string2Foo, foo2String" data-ng-model="foo">
objectfoo
と関数string2Foo
を検索し、foo2String
カスタム (デ) シリアライゼーションをセットアップします。