3

我在 ng-repeat 表中有两个日期字段，代码如下所示：

<tr ng-repeat="ol in orderLines">
    <td>
        <input class="audioStartTime" type="text" ng-model="ol.AudioStartTime"/>
    </td>
    <td>
        <input class="audioEndTime" type="text" ng-model="ol.AudioEndTime"/>
    </td>

正如名称所述，audioStartTime 和 audioEndTime 是时间字段，所以我需要在它们上应用输入掩码。我使用了以下代码：

$('.audioStartTime').each(function(index) {
     $(this).inputmask("hh:mm:ss", {placeholder: "HH:MM:SS", insertMode: false, showMaskOnHover: false});
});

我测试了这段代码。在零件完全加载后，我将它们输入到开发人员工具的控制台中，它工作得很好。但是，问题是，当我将此代码放入 document.ready 时，这似乎不起作用。

在我看来，angularJS 可能具有在计算 ng-repeat 数据后重新加载/重新呈现表格内容的机制。真的吗？是这样，我可以在哪里放置我的输入掩码代码，以便在加载 angularJS 元素后完成？

4

1 回答 1

2

我自己才得到答案。这是帮助我得到答案的链接：http: //valve.github.io/blog/2013/08/01/jquery-inputmask-plugin-plus-angularjs/

所以基本上要使用任何 jQuery 插件，我应该将其放入指令而不是控制器中。所以在指令中：

    assignToFirmApp.directive('inputMaskTime', function() {
        return {
            require: "ngModel",
            link: function (scope, elem, attr, ctrl) {
                $(elem).inputmask("hh:mm:ss", {placeholder: "HH:MM:SS", insertMode: false, showMaskOnHover: false});
                elem.on('keyup', function () 
                {
                    scope.$apply(function()
                    {
                        ctrl.$setViewValue(elem.val());
                    });
                });
            }
        };
    });

在页面中：

<input class="audioStartTime" input-mask-time="true" type="text" ng-model="ol.AudioStartTime"/>
于 2015-11-11T00:40:15.983 回答