如何访问不同控制器的功能? - JavaScript MVC
假设我有2个控制器处理页面的两部分 - 页眉和页面内容。大多数操作发生在pagecontent.js(页面内容的控制器)中。它具有加载各种视图的功能集。但标题有后退按钮。我跟踪历史记录,当单击后退按钮时,我想调用pagecontent.js上的相应函数来加载特定视图。下面是我想要做的例子:如何访问不同控制器的功能? - JavaScript MVC
pagecontent.js
$.Controller('Controller.Pagecontent', {
...
".home click": function(){
this.loadHome();
},
loadHome: function(){
$('#pagecontent').html('//views/home', {});
}
...
})
header.js
$.Controller('Controller.Header', {
...
".back click": function(){
if(HISTORY[0] == 'home')
// call loadHome() from pagecontent.js
}
...
})
我不想复制所有这些功能到头。 js,因为它将是多余的,一些函数具有复杂的逻辑。
任何想法?
谢谢。
您可以使用原型访问其他控制器功能/事件。例如。在这种情况下,这将是这样的:
$.Controller('Controller.Header', {
...
".back click": function(){
if(HISTORY[0] == 'home')
Controller.Pagecontent.prototype.loadHome();
}
...
})
如果js代码每页都不相同,那么可以使用内联js或在单独的文件中添加这些代码行并将其包含在布局中(假设您有不同的布局以便相同的js文件是没有到处加载)
JavaScript中的任何定义的对象都可以从浏览器页面中的任何javascript代码访问。
如果在同一页面中加载两个.js
文件,尽管在一个对象中的不同部分中的对象可能会在另一个中访问,因此可能会在window
对象中定义这些对象。如果file2.js被file1.js后加载
file1.js
var a = 13;
var b = 14;
file2.js
alert("a="+a);
function show_b() {
alert("b="+b);
}
以 '= 13' 的警报将被显示。只要您在加载两个文件之前调用show_b()
,就会显示'b = 14'。
为避免干扰,您可以使用windows.a
和windows.b
而不是a
和b
。
相同的例子适用于函数定义。
有很多方法来共享代码,但在JavaScriptMVC惯用的方法是这样的:
".back click": function(){
if(HISTORY[0] == 'home')
$('#pageContent').controller().loadHome();
}
其中#pageContent
是选择你用于首先创建控制器。
更好的是使用自定义事件。你可以使用jQuery。触发如果pageContent是头部的父:
// PageContent
"home.clicked": function() {
this.loadHome();
}
// Header
".back click": function() {
this.element.trigger('home.clicked');
}
或者你可以使用一个OpenAjax事件:
// PageContent
"home.clicked subscribe": function() {
this.loadHome();
}
// Header
".back click": function() {
OpenAjax.hub.publish('home.clicked');
}
不幸的是,因为我使用的控制器,这将不起作用:$ .Controller('Controller.Header ', { ... 功能 ... } );我不能通过从另一个控制器调用它来访问该函数。 – Sherzod 2012-01-30 22:39:04