Блог

Я пытаюсь медленно преобразовать базовое приложение в Angular. На самом деле он использует Marionette, если быть точным. В каждом из моих текущих представлений Marionette они являются марионетками.Просмотр элементов. Для отображения шаблона я делаю это:

     get template() {
        return _.template(nameOfMyTemplate, { myModel: this.model });
    }
 

nameOfMyTemplate будет моим AwesomeTemplate.template.html файл, который находится в моем решении.

Мне было интересно, как я мог бы просто передать свой template.html без вызова _.template в приложении backbone или marionette? Итак, где-то в моем представлении backbone или marionette.itemview я мог бы сделать

 template: NewAwesomeAngularTemplate.template.html // where NewAwesomeAngularTemplate.template.html is a file in my solution
 

Кто-нибудь уже сталкивался с этим? Я не смог найти много информации о том, как люди конвертировали свои приложения в Angular из Backbone или Marionette. Заранее спасибо!

Marionette ожидает, что все шаблоны будут доступны немедленно, и их не нужно будет извлекать асинхронно. Функцию view.template можно легко перезаписать, но она должна немедленно возвращать строку (или возвращать функцию, которая немедленно вернет строку).

Был старый форк под названием Marionette.Асинхронность, которая позволяла извлекать шаблоны по требованию, но от нее давно отказались после того, как разработчики определили, что это действительно плохая идея.

Лучше всего создать механизм, который либо загружает все шаблоны в память заранее (например, встраивая их в один JS-файл или главную HTML-страницу), либо пользовательский механизм, который гарантирует, что шаблоны извлекаются по мере необходимости до использования представления. Первый будет намного проще, но жизнеспособность зависит от того, сколько у вас шаблонов и насколько они велики.

Не слишком знаком с Backbone или Marionette, но перешел и посмотрел на веб-сайт.

Я не уверен, что это то, о чем вы спрашиваете, поэтому извините меня, если я ошибаюсь. В Angular вы можете использовать ngRouter или более мощный uiRouter для привязки ваших URL-адресов к контроллерам и представлениям.

 state('index', {
  url: "/",
  controller: 'SomeController',
  templateUrl: "template/NewAwesomeAngularTemplate.html"
})
 

Не уверен, что это то, что вы искали. Если это так, ознакомьтесь с документацией по адресу https://github.com/angular-ui/ui-router

Вы можете использовать поддержку grunt ts html2ts: https://github.com/grunt-ts/grunt-ts#html-2-typescript-support

Он превращает HTML-файл в строковую переменную typescript, которую вы можете вернуть из функции шаблона.