如何在angularjs，ui-router和$ stateParams中使用url参数

Question

I have followed the instructions from https://github.com/angular-ui/ui-router/wiki/URL-Routing but cannot get this to work properly.

I have the following:

var application = angular.module('application', ['ui.router']);

application.config(function ($stateProvider, $urlRouterProvider, $locationProvider) {
$urlRouterProvider.otherwise("/test");

$stateProvider
    .state('index', {
        url: "/test/:param",
        templateUrl: "App/Test.html", 
        controller: function ($scope, $stateParams) {
            alert($stateParams.param);
        }
    });   

$locationProvider.html5Mode(true);
});

Without the /:param this works as you would expect - ie the ui-view is correctly populated with Test.html. However, whenever I put the /:param in I get an error. The error is:

GET http://localhost:3880/test/App/Test.html 404 (Not Found)

App is the route of my angular stuff and Test.html should have a path of

http://localhost:3880/App/Test.html 

which it does if not trying /:param. However, when trying /:param you can see that there is an extra /test/ in the path before /App.

Please someone help, as I would like to consume the parameter in the controller once it is correct.

Answer 1

您用于此路由的URL应该是这样的： http://localhost:3880/test/app其中app是param。

Answer 2

Use absolute path for templateUrl. relative url wont work.

templateUrl: "/path/to/App/Test.html",