带有id参数的AngularJS路由以白页结尾答案

【问题标题】：AngularJS routing with id parameter ends in white page带有id参数的AngularJS路由以白页结尾
【发布时间】：2014-06-28 17:29:52
【问题描述】：

var app = angular.module('application', [ 'ngRoute', 'ui.bootstrap' ]);

// configure our routes
app.config(function($routeProvider, $locationProvider) {

    $locationProvider.html5Mode(true);

    $routeProvider
        // route for the home page
        .when('/', {
            templateUrl : 'assets/views/home.php',
            controller  : 'HomeCtrl'
        })

        // route for the home page
        .when('/dev', {
            templateUrl : 'assets/views/dev.php',   
            controller  : 'devCtrl'
        })

        // route for the home page
        .when('/dev/:id', {
            templateUrl : 'assets/views/dev.php',
            controller  : 'devCtrl'
        });

});

app.run(function($rootScope, $window, $location, $route, $templateCache) {  
    $rootScope.$on('$routeChangeStart', function() {

    });
});

我使用上述角度来路由我的页面。我正在尝试使用参数访问 URL，而我得到的只是一个白页。 http://domain.com/dev/1234

我错过了什么吗？

【问题讨论】：

您是否尝试过通过您使用的浏览器的开发工具查看控制台？此外，您可能已经验证了这一点，但以防万一，assets/views/dev.php 是否可以访问并且其他路由是否有效？
@nstehr 我发布了我的问题的答案

标签： javascript angularjs angularjs-scope angularjs-routing

【解决方案1】：

事实证明，我需要在templateUrl 的开头添加一个/

console.log 错误表明它正在尝试再次加载 Angular。

var app = angular.module('application', [ 'ngRoute', 'ui.bootstrap' ]);

// configure our routes
app.config(function($routeProvider, $locationProvider) {

    $locationProvider.html5Mode(true);

    $routeProvider
        // route for the home page
        .when('/', {
            templateUrl : '/assets/views/home.php',
            controller  : 'HomeCtrl'
        })

        // route for the home page
        .when('/dev', {
            templateUrl : '/assets/views/dev.php',   
            controller  : 'devCtrl'
        })

        // route for the home page
        .when('/dev/:id', {
            templateUrl : '/assets/views/dev.php',
            controller  : 'devCtrl'
        });

});

app.run(function($rootScope, $window, $location, $route, $templateCache) {  
    $rootScope.$on('$routeChangeStart', function() {

    });
});

【讨论】：