个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
31
4
我正在尝试使用 diff2html 格式化 Angular 指令内的 diff和 var jq = $.noConflict();
我创建了一个 Angular 常量来保存 jQuery 并将其传递到指令中，如下所示:
app.js
(function () { //IIFE to enable strict mode
'use strict';
angular.module('dashboard', ['ui.router', 'ngSanitize'])
.config(['$interpolateProvider', function ($interpolateProvider) {
$interpolateProvider.startSymbol('[[[').endSymbol(']]]');
}])
.constant('jQuery', window.jQuery);
})();
directive.js
(function () { //IIFE to enable strict mode
'use strict';
angular.module('dashboard')
.directive("loadDiff", ['$http', 'jQuery', function($http, $) {
return {
restrict: "A",
link: function(scope, elem, attrs) {
$http.get("diff url here").success(function (data) {
var diff2htmlUi = new Diff2HtmlUI({diff: data});
diff2htmlUi.draw('#line-by-line');
});
}
}
}]);
})();
问题
当它运行时，我收到以下错误:
TypeError: $ 不是 Diff2HtmlUI 的函数。_initSelection 在新的 Diff2HtmlUI
对此进行调试，您可以看到，当实例化 Diff2HtmlUI 时，它会尝试设置正文，但由于与 var jq = $.noConflict(); 冲突，这可能会失败。.
Diff2HtmlUI.prototype._initSelection = function() {
var body = $('body');
var that = this;
如何解决这个问题？我希望传入 jQuery 作为 $ 会覆盖 noconflict 冲突？
最佳答案
我真的不明白为什么你要将 jQuery 传递给你的指令。由于您直接加载了它，因此您和 diff2html 已经可以通过全局 window 对象访问它。
此外，您可能只想传递指令 element 而不是外部 div id，只需将其作为 $(elem) 传递，因为它需要 jQuery 对象或DOM 查询字符串。
angular.module('dashboard', [])
.config(['$interpolateProvider', function ($interpolateProvider) {
$interpolateProvider.startSymbol('[[[').endSymbol(']]]');
}])
.constant('jQuery', window.jQuery)
.directive('loadDiff', ['$http', function ($http) {
return {
restrict: 'A',
link: function (scope, elem, attrs) {
$http({
url: 'https://api.github.com/repos/rtfpessoa/diff2html/pulls/106.diff',
headers: {
accept: 'application/vnd.github.v3.diff'
}
})
.then(function (resp) {
var diff2htmlUi = new Diff2HtmlUI({ diff: resp.data });
diff2htmlUi.draw($(elem));
})
}
}
}]);<html>
<head>
<link href="https://cdnjs.cloudflare.com/ajax/libs/diff2html/2.3.0/diff2html.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/diff2html/2.3.0/diff2html.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/diff2html/2.3.0/diff2html-ui.js"></script>
<script data-require="angular.js@1.6.2" data-semver="1.6.2" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.2/angular.js"></script>
<script data-require="jquery@3.1.1" data-semver="3.1.1" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
</head>
<body ng-app="dashboard">
<div load-diff="load-diff">Loading diff...</div>
</body>
</html>关于jquery - 在 Angular 指令中以 noconflict 运行 jQuery 插件 diff2html，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/43808805/
31
4
0
我一直在一个页面上使用 2 个不同版本的 jQuery，并尝试利用“noConflict”。 如果我为每个 jQuery 版本建立一个变量(例如:$a 和 $b)，我是否会将所有 $ 替换为“$a”和
我想包含 jQuery，并希望我可以做如下的事情: $.noConflict(); jQuery("#id").click(Alert("Hello World")); End.noConflict
我使用 Prototype JS 作为主要 JS 库，并且我已将最后一个 RedactorJS 与 jQuery 以无冲突模式集成，但我无法启动如下功能: jQuery('#redactor').re
我在我的 Rails 应用程序中使用 Prototype 和 jQuery。为了解决 $ 冲突，我执行以下操作: var $j = jQuery.noConflict(); 这基本上工作正
我尝试使用 jQuery.noConflict() 但在 window.load 函数中我收到“$ 不是函数”错误。 我的代码: jQuery.noConflict(); jQuery(documen
我一直在使用 masonry 在 this site 上收到未捕获的类型错误 Uncaught TypeError: Cannot call method 'apply' of undefined 当
我需要使用第三方提供的一些用 jquery 编写的库。一旦我尝试合并 jquery，我们最终会与代码库中的 $ 符号发生冲突。我能够通过为 $ 符号创建别名来解决冲突，然后也在第三方库中使用别名更新
我在同一个 html 页面上使用 javascript 和 jquery 代码。由于某种原因，jQuery 库阻止我的 native JavaScript 代码正常工作。 我找到了这个页面:jQuer
这个问题已经有答案了: Including More Than One jQuery Versions (2 个回答) 已关闭 9 年前。 我有以下代码， alert($().jquery); //
我加载了多个 jquery 库(无法更改这一点，托管 ecom 平台，对某些内容的访问权限有限)，所以我需要避免它们发生冲突。当前代码: $(document).ready(function(
这是我尝试使用下划线运行的小代码: var data = [ {"name": "Romania"}, {"name": "Virgin Island
这是我在页面中使用的详细信息... 当我要并行使用所有三个脚本时， slider 脚本不起作用，所以给我解决方案如何一起使用。 最佳答案 使用jQuery.noConflict()
我有两个文件。 HTML 和 .js 文件。在 code.js 中，我编写了 jquery 代码，在 HTML 文件中，我包含了 code.js，如下所示: jQuery.noConflict(
我正在编写一个书签，我想在其中使用 jquery forms 插件。 我遇到的问题是，可能使用书签的网页可能使用不同的 js 库，该库已经使用“$”。没问题，我可以告诉 jQuery 使用 noCon
我有一行代码导致图像 slider 和自动完成的搜索栏之间发生冲突:$J = jQuery.noConflict(); 我在这一行之前有两个脚本:jquery_1-6-4.js 和 jquery.au
我有以下一段 JavaScript，将从客户的网站引用。它使用 jQuery 1.5，所以我的问题是如果客户端已经加载了一个 jQuery 实例怎么办？或者替代的 JavaScript 库？ 我正在使
我正在使用我的 Jquery 应用程序和其他 javascript 库。当用谷歌搜索时，我开始知道 Jquery.noConflict() 是避免与其他库发生冲突的解决方案。出于测试目的，我在 htm
我继承了这样开头的脚本: var $j = jQuery.noConflict(); 但我不知道为什么要这样做。我知道我们正在尝试解决冲突，但我如何才能找到它正在尝试解决的冲突？ 如果我们找不到真正的
我正在将 jQuery 脚本动态加载到随机页面中。有时他们支持 jQuery，有时他们有其他库，有时他们根本没有任何库.. 我需要支持所有情况，因此，首先我检查 jQuery 是否已加载。如果不是，我
我有一些在 jQuery 中给出的代码，我对它真的很陌生。我需要使用 jQuery.noConflict() 方法，因为我也在使用 Mootools 框架。我只是不知道应该在哪里替换“jQuery”代
我是一名优秀的程序员,十分优秀！