Альтернативы $templateCache в Angular2

Question

Альтернативы $templateCache в Angular2

Когда мы думаем об использовании template в Angular2 или Angular1.X мы знаем, что ниже приведен один из основных способов написания:

template: './template-ninja.html'

и с Angular1.X, мы можем предварительно кэшировать все шаблоны с $templateCache.put() следующее:

var myApp = angular.module('Ninja', []);
myApp.run(function($templateCache) {
  $templateCache.put('templateNinja.html', 'This is the content of the template-ninja');
});

что уменьшит количество http запросов. Я хотел бы знать, как я могу реализовать то же самое с Angular2. Кто-нибудь может помочь? Благодарю.

13

angular

Источник

user5707192 22 дек '15 в 15:15

4 ответа

Другие вопросы по тегам angular

user687677 28 фев '16 в 22:15 2016-02-28 22:15 · Answer 1 · 2016-02-28 22:15

проглатывать-рядный NG2-шаблон

На данный момент лучшим решением является gulp-inline-ng2-template.

Это берет компонент с атрибутом templateUrl плюс html-файл и превращает его в компонент с встроенным шаблоном.

https://github.com/ludohenin/gulp-inline-ng2-template

4

Источник

user687677 28 фев '16 в 22:15

user3969946 29 дек '15 в 14:46 2015-12-29 14:46 · Answer 2 · 2015-12-29 14:46

Я пока не знаю библиотеки или инструмента, которые будут кешировать шаблоны для Angular 2, но до сих пор я был рад просто использовать встроенные шаблоны вместо внешних файлов. Использование символа обратной черты es6 для шаблона позволяет писать многострочный HTML-код в JavaScript и хранить все в одном файле.

https://github.com/angular-in-action/chapter2/blob/master/client/components/dashboard.ts#L12

user2482400 23 мар '16 в 13:22 2016-03-23 13:22 · Answer 3 · 2016-03-23 13:22

проглатывать-NG2-шаблонный обертку

Привет,

Надеюсь, что это будет полезно для вас: я только что написал небольшой модуль, который позволяет вам объединить все ваши HTML-файлы в один модуль ES6.

https://github.com/evgenys91/gulp-ng2-template-wrap

2

Источник

user2482400 23 мар '16 в 13:22

user1113772 30 дек '15 в 17:08 2015-12-30 17:08 · Answer 4 · 2015-12-30 17:08

Используйте следующую альтернативу:

Импортировать RuntimeCompiler, рефлектор, ComponentFactory, ComponentResolver, ReflectorComponentResolver и ReflectionInfo
Внедрить RuntimeCompiler
Создать экземпляр ComponentResolver
Вызвать ComponentResolver.resolveComponent(SomeComponent)
Проверьте отражатель.propMetadata для кэшированного результата

    it('должен кешировать результат', inject([AsyncTestCompleter], (async) => {
         PromiseWrapper
             .all([ComponentResolver.resolveComponent(SomeComponent), ComponentResolver.resolveComponent(SomeComponent)])
             .then((protoViewRefs) => {
               ожидать (protoViewRefs[0]) Тоба (protoViewRefs[1]).
               async.done();
             });
       }));

Аннотация это другой способ сделать это:

    это ("должен прочитать шаблон из аннотации",
       inject([AsyncTestCompleter, Compiler], (async, compiler) => {
         ComponentResolver.resolveComponent(SomeComponent)
             .then((hostViewFactoryRef) => {
               ожидать (hostViewFactoryRef.internalHostViewFactory).toBe(someHostViewFactory);
               async.done();
             });
       }));

Рекомендации