Как поместить содержимое $ templateCache.put (...) в html-файл вместо встраивания Html в Javascript?

Question

Внедрение HTML-кода в JavaScript, как и следующий фрагмент кода, не поддерживается, если у вас есть один файл app.js и многие модули.

app.js

app.config(['$routeProvider', function($routeProvider){ 
    $routeProvider.when('/first',{ 
    templateUrl: 'partial/first.html', 
    controller: 'FirstCtrl' 
    }); 
}]).run(function($templateCache){ 
    $templateCache.put('partial/first.html', '<p>Hundred lines of Html</p>'); 
    }); 

Можно ли перенести эти 100 LoC от $ templateCache.put (...) в файл Html так же, как мы используем templateUrl вместо шаблона? ИЛИ предложите другой подход для достижения этого, потому что я теряю контроль над кодом. Я хочу использовать $ templateCache для быстрого извлечения.

Answer 1

Вы должны использовать скрипт сборки, например. с gulp, чтобы сделать это. Существует модуль npm под названием angular-template-cache, который делает именно то, что вы хотите.

var angularTemplateCache = require('gulp-angular-templatecache'); 

gulp.task('compile:templates',() => 
    gulp.src('/src/**/*.html') 
     .pipe(angularTemplateCache('templates.js')) 
     .pipe(gulp.dest('/dist')) 
); 

Эта задача Глоток бы создать файл /dist/templates.js, который содержит $templateCache.put для каждого HTML-файла под src реж. Вы можете сделать эту часть своего процесса сборки вместе с минимизацией, сбоем кэша и т. Д.