主JS模板文件不在角度局部视图中工作| JQuery函数不适用于Partial View

时间:2016-01-10 14:14:01

标签: javascript jquery html angularjs

我是角色的新手,我在index.html页面上启动了以下JS文件,因为我正在处理角度我不得不对不同页面进行局部视图,还有函数在此文件中执行小任务,例如最小化和最大化小部件主体。处理JQuery DataTables,脚本替换文件中的jquery函数只能在索引页面上工作,首先我认为有JQuery Conlfict我已经使用了noConflict来解决冲突,因为我猜是因为如果我粘贴了部分代码直接查看index.html文件,它的工作原理绝对正常。但不是单一功能在任何局部视图上工作。

非常感谢帮助。

由于

来自scripts-replacement.js文件的函数

var handleWidgetTools = function () {
    jQuery('.widget .tools .icon-remove').click(function () {
        jQuery(this).parents(".widget").parent().remove();
    });

    jQuery('.widget .tools .icon-refresh').click(function () {
        var el = jQuery(this).parents(".widget");
        App.blockUI(el);
        window.setTimeout(function () {
            App.unblockUI(el);
        }, 1000);
    });

    jQuery('.widget .tools .icon-chevron-down, .widget .tools .icon-chevron-up').click(function () {
        var el = jQuery(this).parents(".widget").children(".widget-body");
        if (jQuery(this).hasClass("icon-chevron-down")) {
            jQuery(this).removeClass("icon-chevron-down").addClass("icon-chevron-up");
            el.slideUp(200);
        } else {
            jQuery(this).removeClass("icon-chevron-up").addClass("icon-chevron-down");
            el.slideDown(200);
        }
    });
}

在index.html文件中包含和初始化文件

<script src="js/scripts-replaced.js"></script>
<script>
    $.noConflict();
    jQuery(document).ready(function($)
    {
        App.init();
    });
</script>

我也试图使角度指令制定以下角度指令,但它不会起作用,我不知道为什么。

Angular Directive:

Main_Module.directive('everyPage', function()
{
    return {
        restrict: 'A',
        link: function(scope, element, attrs)
        {
            angular.element('.widget .tools .icon-chevron-down, .widget .tools .icon-chevron-up').handleWidgetTools();
        }
    }
});

HTML

<a every-Page href="javascript:;" class="icon-chevron-down"></a>

1 个答案:

答案 0 :(得分:0)

您正试图将handleWidgetTools()函数称为angular.element上的方法,而不是(function () { jQuery('.widget .tools .icon-remove').click(function () { jQuery(this).parents(".widget").parent().remove(); }); jQuery('.widget .tools .icon-refresh').click(function () { var el = jQuery(this).parents(".widget"); App.blockUI(el); window.setTimeout(function () { App.unblockUI(el); }, 1000); }); jQuery('.widget .tools .icon-chevron-down, .widget .tools .icon-chevron-up').click(function () { var el = jQuery(this).parents(".widget").children(".widget-body"); if (jQuery(this).hasClass("icon-chevron-down")) { jQuery(this).removeClass("icon-chevron-down").addClass("icon-chevron-up"); el.slideUp(200); } else { jQuery(this).removeClass("icon-chevron-up").addClass("icon-chevron-down"); el.slideDown(200); } }); })(); 。您需要做的就是运行您的函数来设置jQuery click事件处理程序,如下所示:

WHERE