Question

使用AngularJS进行路由时，脚本将发送额外的HTTP请求以加载视图。但是，如果用户使用该路线的直接链接，那么我们如何避免发出额外请求？即使用单个请求而不是第二个视图请求从服务器加载所有内容？

编辑：

我需要明确我的意思。

如果用户访问website.com＃/ second，其中second是具有相应视图的路由，则AngularJS中的路由系统将使用HTTP请求加载该视图。但是，如果用户没有访问该网站中的任何先前页面，我不希望发生此HTTP请求。相反，应该发生的是服务器在模板中包含该视图。即因为服务器已经包含它，所以不需要获取视图。

换句话说，如何停止路由系统？我可以使用if语句，但是我把它放在哪里？

在我写这篇文章时，我假设一个好的地方就是路线处理功能。

sampleApp.config(['$routeProvider',

    function($routeProvider) {  
        var firstVisit = true;
        if(!firstVisit){

            $routeProvider.
              when('/', {
                templateUrl: 'sections/main.php',
                controller: 'main_controller'
            }).
              when('/second', {
                templateUrl: 'sections/second.php',
                controller: 'second_controller'
            }).
              otherwise({
                redirectTo: '/'
            });   

        }
        firstVisit = false;

    }]);

编辑2：

它不起作用。我希望路由功能依赖于变量的值。

Answer 1

您可以使用 $ templateCache 角度提供程序加载所有角度模板。因此，您可以使用 templateUrl 选项（在您的指令中或仅在您的路由中），它将在您的缓存中检索好模板。

前：

angular.module('template', [])
    .run(['$templateCache', function($templateCache) {
        $templateCache.put('folder/template.html', '<div>your template</div>');
    }]);


angular.module('YourApp', ['template'])
    .config(['$routeProvider', function($routeProvider) {

        $routeProvider
        .when('/route', {
            templateUrl: 'folder/template.html',
            controller: 'MyController'
        });
    }]);

但是，您必须将html转换为javascript字符串才能使用它。 Gulp 和 Grunt 上的一些插件可以为您完成。

希望它能帮到你

使用AngularJS路由时避免额外的HTTP请求

1 个答案: