烬表单验证

Ember form validation

本文关键字:验证 表单      更新时间:2023-09-26

我对Ember有点陌生,我正在做一些应该很简单的事情。只是想验证一个表单。使用余烬形式和余烬验证

这是结构的一部分,我将非常详尽,以便您可以进入重点,但确实没有很多代码:

 /app
   /controllers
     /admin
       /create-user.js
   /models
     /admin
       /create-user.js
   /routes
     /admin
       /create-user.js
   /templates
     /admin
       /create-user.js

首先,我不确定它是好的结构,特别是关于模型。

模型:

import DS from 'ember-data';
import EmberValidations from 'ember-validations';
export default DS.Model.extend(EmberValidations, {
  entity: DS.attr()
}).reopen({
  validations: {
    entity: {
     presence: true,
     length: { minimum: 5 }
    }
  }
});

控制器:

import Ember from 'ember';
export default Ember.Controller.extend({
  actions: {
    createUser() {
      console.log("create");
    }
  }
});

的路线:

import Ember from 'ember';
export default Ember.Route.extend({
  model: function() {
    return this.store.createRecord('admin/create-user');
  }
});

模板:

<h3>Create User</h3>
<div class="row">
  <div class="col-sm-6">
    {{#em-form action="createUser" model=admin/create-user}}
      {{em-input
        label="Name / Entity"
        property="entity"
        placeholder="The name of the user or the entity"}}
    {{/em-form}}
  </div>
</div>

我知道我错过了一些东西,我很确定它与模型有关(我在模板中尝试了很多东西,如model=admin/create-user)。

编辑:在控制台中没有错误或任何东西,只是没有调用验证。

谢谢你的帮助!

首先让我想到的是你从来没有,在你的代码的任何地方,检查数据是否有效:

// Somewhere in your controller
this.get('isValid');

第二个是你的验证是在控制器而不是模型上定义的。如果您的控制器扩展了ObjectController(现在已弃用),它将自动代理属性到模型,那么这将非常有效。

如果你正在扩展Controller,并且你想要验证模型,你需要稍微不同地定义它们:

validations: {
  'model.entity': {
    presence: true,
    length: { minimum: 5 }
  }
}

第三,你从来没有真正通过路由传递你的模型的实例到控制器(即使验证仍然应该工作):

export default Ember.Route.extend({
  model: function() {
    // assuming you're using Ember Data
    // find the model with id of 1
    return this.store.find('admin/create-user', 1);
  }
});