Как получить доступ к функции другого контроллера? - JavaScript MVC - PullRequest
2 голосов
/ 31 января 2012

Предположим, у меня есть 2 контроллера, которые обрабатывают 2 части страницы - заголовок и содержимое страницы. Большинство действий происходит в pagecontent.js (контроллер для содержимого страницы). Он имеет набор функций для загрузки различных видов. Но заголовок имеет кнопку назад. Я отслеживаю историю, и когда нажимается кнопка «Назад», я хочу вызвать соответствующую функцию на pagecontent.js для загрузки определенного представления. Вот пример того, что я пытаюсь сделать:

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
  }
  ...
})


Я не хочу копировать все эти функции в header.js, потому что он будет избыточным, а некоторые функции имеют сложную логику.

Есть идеи?

Спасибо.

Ответы [ 4 ]

0 голосов
/ 20 марта 2012

Есть много способов поделиться кодом, но идиоматический способ в JavaScriptMVC будет выглядеть примерно так:

".back click": function(){
  if( HISTORY[0] == 'home' )
     $('#pageContent').controller().loadHome();
}

где #pageContent - это селектор, который вы использовали для создания контроллера.

Еще лучше было бы использовать пользовательское событие. Вы можете использовать jQuery.trigger, если 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');
}
0 голосов
/ 31 января 2012

Любой определенный объект в javascript может быть доступен из любого кода javascript на странице браузера.

Если вы загружаете два файла .js на одной странице, хотя в разных частях объекты могут быть доступны на другомпоэтому они могут быть определены в window объекте.

file1.js

var a = 13;
var b = 14;

file2.js

alert("a="+a);

function show_b() {
    alert("b="+b);
}

Предупреждение с 'a = 13' будетбудет показано, если file2.js загружен после file1.js.Один с 'b = 14' будет отображаться всякий раз, когда вы вызываете show_b() до загрузки обоих файлов.

Чтобы избежать помех, вы можете использовать windows.a и windows.b вместо a и b.

Тот же пример работает с определениями функций.

0 голосов
/ 31 января 2012

Вы можете получить доступ к функциям / событиям других контроллеров, используя прототип. Например. в этой ситуации это было бы так:

$.Controller('Controller.Header', {
  ...
  ".back click": function(){
      if( HISTORY[0] == 'home' )
         Controller.Pagecontent.prototype.loadHome();
  }
  ...
})
0 голосов
/ 31 января 2012

Если js-код будет отличаться на каждой странице и если он меньше, используйте встроенный js или добавьте эти строки кода в отдельный файл и включите его в макет (при условии, что у вас другой макет, чтобы тот же js-файл не был загружается везде)

...