knockout.js - 如何在 knockout 验证中验证模型

Question

我创建了一个 View 模型，并希望使用 knockout validation 来验证该模型。这是我的 View 模型

function SignInViewModel() {
   var self = this;

   self.userName = ko.observable('').extend({
      required: true,
      pattern: {
         message: 'Username must be a valid email address',
         params: /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/
      }
   });

   self.password = ko.observable('').extend({
      required: true,
      pattern: {
         message: 'Password must be alpha numeric and 4-8 character long .',
         params: /^(?=.*\d).{4,8}$/
     }
   });

   self.login = function () {
      // Want to call validate function here
      $.post("/account/login", { "userName": self.userName(), "password": self.password() })
         .done(function (result) {
            redirect(result.redirect);
     });
    }
}

ko.validation.configure({
   decorateElement: false,
   errorElementClass: "error",   // class name
   insertMessages: false,
   grouping: { deep: true, observable: true }
});

我想在调用登录功能时验证我的模型。

Answer 1

创建一个验证组，例如

self.errors = ko.validation.group(self);

添加一个计算

self.canLogin = ko.computed(function() {
   return self.errors().length === 0;
});

在您的 View 中，将此数据绑定(bind)添加到您的按钮

data-bind="click: login, enable: canLogin"