angularjs - 可以在定义路由之前填充 $templateCache 吗？

Question

我不想延迟加载我的路线模板。相反，我想在执行任何路由之前将所有路由模板加载到 $templateCache 中。

这就是我正在做的事情:

angular.module('myApp', ['ngRoute']).config(['$routeProvider', '$locationProvider', function ($routeProvider, $locationProvider)
{
    $locationProvider.html5Mode(false);

    $routeProvider.when("/main", {templateUrl: "main", controller: "MainCtrl"})
                  .when("/login",{templateUrl: "login", controller: "LoginCtrl"});
}])
.run(['$location','$templateCache', function ($location, $templateCache)
{
   //...Save templates in $templateCache
   $location.path("/login");
}]);

如果您浏览到 /，这可以正常工作因为它不匹配任何路线。但是如果你浏览或刷新 /#/login在我的运行 block 开始运行并向服务器发出请求之前，路由服务似乎尝试加载模板。

无论如何确保填充 $templateCache 的代码将在路由服务查找模板之前执行？

Answer 1

如果你使用 grunt 你我强烈推荐 grunt-angular-templates为此目的，但是如果您不想并且想要手动创建单独的模块，在该模块中您的逻辑与您现在所拥有的类似，则大致如下:

angular.module('myapp.templates').run(['$templateCache', function($templateCache) {
$templateCache.put(...

然后简单地将该模块引用为您的应用程序依赖项。依赖模块的运行 block 将在路由逻辑启动之前首先运行，这就是您想要的。