结合MaskedInput和验证表单使用Ember

Question

我想做一个在客户端验证的表单。所以，我使用了余烬验证的形式。我想在输入中添加一些掩码。

是否可以使用有效的表单进行输入，并在其中添加一个掩码？

{{f.input ... masked-input}}

Answer 1

正如Christian在他的文章中提到的那样，ember-validated-form刚刚更新为一个新版本；它为定制组件提供了更好的支持。请查看下面的转盘，以查看如何使用自定义蒙面输入组件的示例；可以在旋转中使用masked-input-field；可以使用。检查application.hbs的块形式使用f.input.

在这个示例中，我添加了一张信用卡，用于向user.validation.js演示掩码输入的使用和相关验证，以显示自定义掩码输入组件(在下面使用烬-cli-maskedinput )如何使用从validated-input获得的信息响应验证。希望这能有所帮助。

Answer 2

在ember-validated-form内部，不支持蒙面导入。但是，在最新版本的addon (刚刚发布的0.1.10)中，使用块形式的f.input很容易集成自定义组件：

{{#f.input label="Favorite Color" name="color" as |fi|}}
  {{favorite-colors-component colors=colors onupdate=fi.update 
onhover=fi.setDirty}}
{{/f.input}}

(更多细节请参见医生们 )

基于此，您应该能够轻松地集成任何支持隐藏导入(例如烬-cli-maskedinput)的注释。