我们如何在动态插入的输入上设置掩码?

时间:2014-02-06 16:45:34

标签: javascript jquery angularjs jquery-inputmask

Angular-UI-Mask is acting oddly开始,我正在对我的一些输入使用jquery-inputmask,但是当动态插入输入时,Ny Angular它没有掩码:

<li ng-repeat="item in items">
    <input type="text" name="birth_date" class="span2 format_date" ng-model="birth_date" placeholder="Data de Nascimento" required />
</li>

这是相关脚本

<script type="text/javascript">
    jQuery(document).ready(function(){
        $(".format_date").inputmask("99/99/9999");
    });
</script>

我有什么办法可以强迫它将面具设置为新输入吗?

1 个答案:

答案 0 :(得分:1)

像jQuery.inputMask这样的jQuery插件工作时(如你的代码所示)在文档准备就绪时将行为附加到DOM元素上。这将运行一次,而不会再次运行,因此对于动态添加的内容,此方法不起作用。

相反,您需要在相应的DOM更改时运行的内容。所以只要一个&#39;项目&#39;在你的&#39;项目&#39;添加了list,添加了元素,并针对该元素运行了相应的jQuery函数。你需要使用AngularJS,你可以编写自己的指令,但幸运的是,有人已经为你编写了代码:jQuery Passthrough plugin作为Angular UI's UI.Utils的一部分。

这是working Plunkr

您需要将脚本包含在顶部,如此(I downloaded it from GitHub):

<script src="ui-utils.jq.js"></script>

将模块加载到AngularJS中,例如:

var app = angular.module('myApp', ['ui.jq']); 

然后在HTML标记中使用该指令:

<input type="text" ui-jq="inputmask" ui-options="'99/99/9999', { 'placeholder': 'dd/mm/yyyy' }" />