Question

如果您有一个app.js文件和许多模块，则无法维护在JavaScript中嵌入HTML，如下面的代码段。

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来做这件事。有一个名为angular-template-cache的npm模块可以完全按照您的要求进行操作。

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

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

此gulp任务将为/dist/templates.js目录下的每个html文件创建一个文件$templateCache.put，其中包含src。您可以将构建过程的这一部分与缩小，缓存清除等结合起来。

如何将$ templateCache.put（...）的内容放入html文件而不是将Html嵌入到Javascript中？

1 个答案: