Существуют ли какие-либо knockoutjs страницы / фреймворки? - PullRequest
Новая
       31

Существуют ли какие-либо knockoutjs страницы / фреймворки?

40 голосов
/ 14 марта 2012

Исходя из asp.net MVC 3. В MVC4 они представили WebAPI. Было бы неплохо иметь возможность делать весь код вида / маршрутов в javascript и просто полагаться на MVC для API. Черт возьми, это действительно круто, что webapi можно запускать независимо от IIS!

Как говорится:

Существуют ли рамки страниц, которые могут использовать KnockoutJS, которые похожи на мой макет ниже: 

Framework.RegisterRoutes(..,mainViewModel);//sets the CurrentViewModel?

Каждый маршрут является отдельным файлом viewModel и представлением, которое нужно внедрить в главное представление 

var mainviewModel= function(){
   var self = this;
   self.CurrentViewModel = ko.observable();
   ...
   return self;
}

<div id="mainPageContent" data-bind:'html:CurrentViewModel.Render'>
</div>

Я знаю, что многого из этого можно достичь самостоятельно, но не уверен, как добиться регистрации маршрутов / загрузки отдельных файлов

Мне кажется, что основными преимуществами knockoutjs является способность не вмешиваться в то, как вы кодируете js (т. Е. Строить объект / структуру так, как вы хотите, пока взаимодействующие объекты наблюдаемы)

Ответы [ 6 ]

45 голосов
/ 31 января 2013

Pager.js - это структура маршрутизации URL, созданная специально для использования с Knockout.js.Обязательно ознакомьтесь со всей демоверсией , чтобы увидеть ее полную мощность и гибкость.ИМХО, он намного превосходит PathJS и Сэмми.

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

Sammy.js - превосходная облегченная библиотека JavaScript для маршрутизации. Вы можете делать такие вещи для маршрутизации при использовании в паре с Knockout (с веб-сайта учебных пособий или KnockoutJS): 

$.sammy(function() {
    this.get('#:folder', function() {
        self.chosenFolderId(this.params.folder);
        self.chosenMailData(null);
        $.get("/mail", { folder: this.params.folder }, self.chosenFolderData);
    });

    this.get('#:folder/:mailId', function() {
        self.chosenFolderId(this.params.folder);
        self.chosenFolderData(null);
        $.get("/mail", { mailId: this.params.mailId }, self.chosenMailData);
    });

    this.get('', function() {
        this.app.runRoute('get', '#Inbox');
    });
}).run();

Другим вариантом является использование SproutCore, но это намного больше, чем навигация, поэтому я не рекомендую этот маршрут, если вам не нужен весь SproutCore. Есть много других библиотек, но мне нравится Sammy.js из-за его легкости.

8 голосов
/ 08 мая 2016

Я бы хотел, чтобы будущие гуглеры / SOers работали с ko-component-router .

IMO API гораздо более лаконичен, чем Pager.js, и, будучи специально разработан для KO, он имеет такие полезные свойства, как наблюдаемые параметры маршрута и строки запроса.

Лучше всего, он активно поддерживается и останется таковым в обозримом будущем.

ОТКАЗ ОТ ОТВЕТСТВЕННОСТИ : я разработчик этого пакета.

3 голосов
/ 14 марта 2012

Я использовал PathJs с некоторым успехом, есть также Сэмми , который является скорее основой. Ни один из них не является специфическим для KO.

Более тяжелым, но KO-оптимизированным решением будет Knockback .

Надеюсь, это поможет.

2 голосов
/ 21 декабря 2013

Более старый вопрос, но для справки. Дюрандаль - отличная структура SPA для нокаута:

http://durandaljs.com/documentation/Introduction/

1 голос
/ 25 апреля 2015

Я только что открыл исходный текст мини-каркаса SPA, который я создал вместе с Knockout, являющимся основным компонентом.

knockout-spa Мини-(но полноценный) SPA-каркас, построенный сверхуНокаута, Требуй, Директор, Сахар.https://github.com/onlyurei/knockout-spa

Демонстрация в реальном времени: http://knockout -spa.mybluemix.net

Функции

  • Маршрутизация(основано на директоре Flatiron): история HTML5 (pushState) или хэш.
  • Высокая степень компоновки и возможность многократного использования: выберите модули / компоненты для страницы в JS, специфичном для страницы, и они будут автоматически подключены для HTML страницы.template
  • SEO ready (prerender.io)
  • Быстрый и легкий (85 КБ JS минимизировано и реализовано)
  • Двухуровневая сборка пакетов для JS для производства: общий модулькоторые будут использоваться большинством страниц, а также специфичными для страниц модулями, которые будут загружаться с отложенной загрузкой
  • Организованная структура папок, помогающая вам оставаться в здравом уме при организации и повторном использовании JS, CSS, HTML
  • Использование Knockout3.3.0+, готовые к использованию в Knockout веб-компонента и пользовательских тегов (http://knockoutjs.com/documentation/component-overview.html)
  • Вся документация находится на собственных домашних страницах основных зависимостей, поэтому вам не нужно полностью изучать новую платформу
...