angularjs路由，如何检查模板文件是否存在

我在我的应用程序中使用 angularjs，一切都运行良好，但在加载模板之前我只想检查它是否确实存在于给定的路径上。

这是我的代码：

    .when("/:page", angularAMD.route({

        templateUrl: function (rp) { 
                     return 'public/templates/' + rp.page.replace('.html', '') + '.php'; },

        resolve: {
        load: ['$q', '$rootScope', '$location', 
            function ($q, $rootScope, $location) {

                 var path = $location.path();
                 //console.log(path);
                 var parsePath = path.split("/");

                 var controllerName = parsePath[1];
                 controllerName = controllerName.replace('.html', '').replace('_', '');
                 var loadController = "public/js/controllers/" +  
                                       controllerName + "Controller.js";

                 var deferred = $q.defer();
                 require([loadController], function () {
                        $rootScope.$apply(function () {
                        deferred.resolve();
                 });
            });
            return deferred.promise;
            }]
        }

    }))

我想要在这样做之前return 'public/templates/' + rp.page.replace('.html', '') + '.php'; }它必须检查这个文件是否存在，否则我想重定向到404页面。

现在发生的情况是，当我访问一些无效链接时，我没有得到 404 状态，而是加载主 index.html 文件，因此，它开始无限循环运行相同的代码，最后浏览器挂起。

感谢您的帮助，谢谢。

在ngRoute中，需要在config块，并且在配置块内您不能使用工厂和服务，
所以你可以使用一个简单的技巧来检查模板是否存在，如果不存在则返回 404 页面。

var checkTplUrl = function(url) {
    var http = new XMLHttpRequest();
    http.open('HEAD', url, false);
    http.send();
    return (http.status !== 404) ? url : './404.html';
};

.when("/:page", angularAMD.route({

    templateUrl: function (rp) {
        return checkTplUrl('public/templates/' + rp.page.replace('.html', '') + '.php'); },

    resolve: {
        load: ['$q', '$rootScope', '$location',
            function ($q, $rootScope, $location) {

                var path = $location.path();
                //console.log(path);
                var parsePath = path.split("/");

                var controllerName = parsePath[1];
                controllerName = controllerName.replace('.html', '').replace('_', '');
                var loadController = "public/js/controllers/" +
                        controllerName + "Controller.js";

                var deferred = $q.defer();
                require([loadController], function () {
                    $rootScope.$apply(function () {
                        deferred.resolve();
                    });
                });
                return deferred.promise;
            }]
    }

}))

工作示例：https://plnkr.co/edit/1UjlFgT7dazMZOrAhZzY?p=info https://plnkr.co/edit/1UjlFgT7dazMZOrAhZzY?p=info