Архитектура приложений с Durandal

У меня есть приложение, созданное с помощью DurandalJS, со следующим:

  1. Index.html: базовая страница по умолчанию.
  2. Shell.js: оболочка — содержит меню
  3. intro.js: модель представления отображается в оболочке, если пользователь не аутентифицирован
  4. home.js: модель представления отображается в оболочке, если пользователь аутентифицирован

Мой код аутентификации вызывается из shell.js.

Мне нужно, чтобы моя оболочка могла отслеживать некоторые свойства в файлах intro.js и home.js. В частности, если пользователь выбирает элемент с флажком в одном из этих представлений, мне нужно иметь shell.js для изменения пунктов меню. В идеале это можно сделать, позволив оболочке «наблюдать» за вещами в моделях представления. Это возможно?


single-page-application knockout.js durandal
person SB2055    schedule 30.04.2013    source источник

Ответы (2)


arrow_upward
7
arrow_downward

У меня была такая же проблема некоторое время назад. Я использовал события Durandal для реализации связи между оболочкой и другими представлениями.

Вы можете найти информацию о событиях Durandal по следующей ссылке: http://durandaljs.com/documentation/Events/< /а>

Я привожу вам пример, потому что документация не очень понятна.

Чтобы запустить событие в Durandal, вы должны использовать модуль приложения:

app.trigger("someEvent");

Чтобы поймать это событие, вы должны сделать это:

app.on("someEvent", function () {
  //Do that you want
});

Также эту коммуникацию можно реализовать с хранением информации в локальном хранилище или что-то в этом роде, но я думаю, что использование событий более понятно.

Если кто-то может дать какое-либо другое решение этой проблемы, было бы здорово.

person jvrdelafuente    schedule 30.04.2013
comment
Спасибо. Есть какие-нибудь мысли о пабе/сабе Knockout? knockmeout.net/2012/05/using-ko-native- pubsub.html - person SB2055; 30.04.2013
comment
Я только что прочитал вашу ссылку, я думаю, что это тоже очень интересно, я посмотрю более подробно после. Но я думаю, что модуль событий durandal проще в использовании, и если вы используете durandal, имеет смысл использовать этот модуль. Спасибо за ссылку. - person jvrdelafuente; 30.04.2013

arrow_upward
1
arrow_downward

В итоге я использовал pub/sub отсюда: Knockmeout.net/2012/05/using-ko-native-pubsub.html

Моя скрипка: http://jsfiddle.net/PTSkR/38/

/* Pub/sub code */
var postbox = new ko.subscribable();

ko.subscribable.fn.publishOn = function(topic) {
    this.subscribe(function(newValue) {
        postbox.notifySubscribers(newValue, topic);
    });

    return this; //support chaining
};

ko.subscribable.fn.subscribeTo = function(topic) {
    postbox.subscribe(this, null, topic);

    return this;  //support chaining
};

/* Selection code */
this.selectedItems = ko.observableArray().subscribeTo("TOPIC");

var viewModel = {
    documents: [{"documentId": "1"}, {"documentId": "2"}, {"documentId": "3"}],
    selectedDocumentIds: ko.observableArray()
};

viewModel.documentIndex = {};
ko.utils.arrayForEach(viewModel.documents, function(doc) {
   viewModel.documentIndex[doc.documentId] = doc; 
});

this.selectedDocuments = ko.computed(function() {
    return ko.utils.arrayMap(viewModel.selectedDocumentIds(), function(id) {
        return viewModel.documentIndex[id];
    });
}).publishOn("TOPIC");

ko.applyBindings(viewModel);
person SB2055    schedule 30.04.2013