Question

以下是控制器中的jQuery代码，该代码适用于模板加载时创建的输入元素。现在问题是，我有一个下拉菜单，在选项选择的基础上，我显示了一个日期输入框，但是在这种情况下，日期选择器没有显示。

让我知道在这种情况下我需要做什么。我试过并找到了一些关于directive实施的解决方案，但我不是经验丰富的，也不知道它是否会解决我的问题。

我在控制器中的jQuery代码 -

angular.module("app").controller("myCtrl", function($scope, userService, $http) {
    $(document).ready(function(){
        /****  Datepicker  ****/
        if ($('.datepicker').length && $.fn.datepicker) {
            $('.datepicker').each(function () {
                var datepicker_inline = $(this).data('inline') ? $(this).data('inline') : false;
                $(this).datepicker({
                    inline: datepicker_inline,
                    formatDate:'Y-m-d'
                });
            });
        }

        /****  Datetimepicker  ****/
        if ($('.datetimepicker').length && $.fn.datetimepicker) {
            $('.datetimepicker').each(function () {
                var datetimepicker_inline = $(this).data('inline') ? $(this).data('inline') : false;
                $(this).datetimepicker({
                    inline: datetimepicker_inline,
                    formatDate:'Y-m-d'
                });
            });
        }
    });

});

Answer 1

如果代码不属于控制器，则首先不必存在。请记住，角度和jQuery插件可以共存，每个项目都不同。很难有意见，因为我不知道你想要实现的目标，但这应该会有效：

angular.module("app").controller("myCtrl", function($scope, userService, $http) {

 //... controller's logic here

});

$(document).ready(function(){
    /****  Datepicker  ****/
    if ($('.datepicker').length && $.fn.datepicker) {
        $('.datepicker').each(function () {
            var datepicker_inline = $(this).data('inline') ? $(this).data('inline') : false;
            $(this).datepicker({
                inline: datepicker_inline,
                formatDate:'Y-m-d'
            });
        });
    }

    /****  Datetimepicker  ****/
    if ($('.datetimepicker').length && $.fn.datetimepicker) {
        $('.datetimepicker').each(function () {
            var datetimepicker_inline = $(this).data('inline') ? $(this).data('inline') : false;
            $(this).datetimepicker({
                inline: datetimepicker_inline,
                formatDate:'Y-m-d'
            });
        });
    }
});

Answer 2

我使用ng-show解决了这个问题。

最初我使用的是动态创建元素的ng-if，但我更改了ng-show，如 -

.form-group(ng-if="event.repeat === 2")

TO

.form-group(ng-show="event.repeat === 2")

document.ready不适用于angularjs中新创建的元素

2 个答案: