2

次の jsFiddle リンクを参照してください: http://jsfiddle.net/7gS6N/。

ノックアウト js を使用して簡単なフィールド レベルの検証を実行しようとしています。

「エラーの追加」をクリックして、名前フィールドのエラーの追加をシミュレートします。

エラーが Errors コレクションに追加されると、css バインディングが起動し、式が true と評価され、css クラスが適用されます。

これは素晴らしいことですが、css バインディング式のプロパティを固有のものにするにはどうすればよいですか?

css: { error: Errors().length > 0 }

名前フィールドにcssクラスを表示するだけです。

ありがとう！

4

1 に答える 1

1

あなたは余分な観測量が必要なので、代わりに

self.Name = ko.observable("John")

あなたが使う

self.Name = new Field("John Smith");

ここで、フィールドの構造は次のとおりです。

function Field(value) {
  var self = this;
  self.value = ko.observable(value);
  self.hasError = ko.observable(false);
}

そして、あなたのマークアップは次のようになります

<div data-bind="with:Name">
  <input type="text" data-bind="value: value, css: { error: hasError }" />
</div>

この戦略は、オブジェクトの装飾として知られています。この場合、変数をクラスに「ラップ」しましたが、そこから、、およびこれらすべての特定のフィールドに持たせたいその他の属性をlabel追加できます。errorMessage最後に、ここで実際の例を使用してフィドルを更新しました。

于 2013-01-07T22:07:51.650 に答える