Plone 和 AngularJS 路由
Plone and AngularJS routing
我是一个 AngularJS 新手,我正在尝试编写一些基于 AngularJS 的 Plone 插件。
我遇到但不知道如何避免的问题是关于路由的。
所以,比方说,我有一些 Plone URL,即 http://localhost/blah/my_page
此页面使用 AngularJS 及其路由。
单击某些 Angular 托管按钮,用户会到达 http://localhost/blah/my_page#/angular_page
并且功能正常工作。
这有效,但只能在刷新之前有效。当一个人试图刷新 http://localhost/blah/my_page#/angular_page
Plone 的 jQuery 开始抱怨。
即在plone.app.jquery
(1.7.2版本)中引发语法错误,如下:
Uncaught Error: Syntax error, unrecognized expression: #/angular_page
m.error @ ++resource++plone.app.jquery.js:3
m.filter @ ++resource++plone.app.jquery.js:3
m @ ++resource++plone.app.jquery.js:3
c.querySelectorAll.m @ ++resource++plone.app.jquery.js:3
f.fn.extend.find @ ++resource++plone.app.jquery.js:3
(anonymous function) @ form_tabbing.js:166
e.extend.each @ ++resource++plone.app.jquery.js:2
e.fn.e.each @ ++resource++plone.app.jquery.js:2
$.fn.ploneTabInit @ form_tabbing.js:157
ploneFormTabbing.initialize @ form_tabbing.js:174
(anonymous function) @ form_tabbing.js:179
f.Callbacks.o @ ++resource++plone.app.jquery.js:2
f.Callbacks.p.fireWith @ ++resource++plone.app.jquery.js:2
e.extend.ready @ ++resource++plone.app.jquery.js:2
c.addEventListener.B @ ++resource++plone.app.jquery.js:2
Plone 的 jQuery 似乎验证了 URL 而 Angular 的部分不匹配。
避免该问题的最佳方法是什么?
感谢您的帮助。
以防万一有人遇到同样的问题,我最终找到了解决方案。
问题的根本原因在于 form_tabbing.js
文件,以及 ploneTabInit
函数中的以下代码:
var targetPane = item.find('.enableFormTabbing input[name="fieldset"]').val() || window.location.hash;
if (targetPane) {
item.find(".enableFormTabbing .formTabs " +
targetPane.replace("'", "").replace(/^#fieldset-/, "#fieldsetlegend-")).click();
}
window.location.hash
被分配给 targetPane
,因此出现了问题。
它触发了使用 jQuery 的 Sizzle 搜索引擎对该值的搜索。
$('#/something')
之类的搜索会引发语法错误。
在这个特定视图中禁用 form_tabbing.js 对我来说就足够了。
我是一个 AngularJS 新手,我正在尝试编写一些基于 AngularJS 的 Plone 插件。
我遇到但不知道如何避免的问题是关于路由的。
所以,比方说,我有一些 Plone URL,即 http://localhost/blah/my_page
此页面使用 AngularJS 及其路由。
单击某些 Angular 托管按钮,用户会到达 http://localhost/blah/my_page#/angular_page
并且功能正常工作。
这有效,但只能在刷新之前有效。当一个人试图刷新 http://localhost/blah/my_page#/angular_page
Plone 的 jQuery 开始抱怨。
即在plone.app.jquery
(1.7.2版本)中引发语法错误,如下:
Uncaught Error: Syntax error, unrecognized expression: #/angular_page
m.error @ ++resource++plone.app.jquery.js:3
m.filter @ ++resource++plone.app.jquery.js:3
m @ ++resource++plone.app.jquery.js:3
c.querySelectorAll.m @ ++resource++plone.app.jquery.js:3
f.fn.extend.find @ ++resource++plone.app.jquery.js:3
(anonymous function) @ form_tabbing.js:166
e.extend.each @ ++resource++plone.app.jquery.js:2
e.fn.e.each @ ++resource++plone.app.jquery.js:2
$.fn.ploneTabInit @ form_tabbing.js:157
ploneFormTabbing.initialize @ form_tabbing.js:174
(anonymous function) @ form_tabbing.js:179
f.Callbacks.o @ ++resource++plone.app.jquery.js:2
f.Callbacks.p.fireWith @ ++resource++plone.app.jquery.js:2
e.extend.ready @ ++resource++plone.app.jquery.js:2
c.addEventListener.B @ ++resource++plone.app.jquery.js:2
Plone 的 jQuery 似乎验证了 URL 而 Angular 的部分不匹配。
避免该问题的最佳方法是什么? 感谢您的帮助。
以防万一有人遇到同样的问题,我最终找到了解决方案。
问题的根本原因在于 form_tabbing.js
文件,以及 ploneTabInit
函数中的以下代码:
var targetPane = item.find('.enableFormTabbing input[name="fieldset"]').val() || window.location.hash;
if (targetPane) {
item.find(".enableFormTabbing .formTabs " +
targetPane.replace("'", "").replace(/^#fieldset-/, "#fieldsetlegend-")).click();
}
window.location.hash
被分配给 targetPane
,因此出现了问题。
它触发了使用 jQuery 的 Sizzle 搜索引擎对该值的搜索。
$('#/something')
之类的搜索会引发语法错误。
在这个特定视图中禁用 form_tabbing.js 对我来说就足够了。