Угловая маршрутизация с выдачей параметров

0

У меня есть приложение MVC, я хочу сделать маршрутизацию для следующего URL-адреса

http://localhost:2668/Home/User/1

я попробую

.config(function ($routeProvider, $locationProvider) {
//here we will write code for implement routing 
$routeProvider
.when('#/Home/User/:userid', {
    templateUrl: '/AngularTemplates/User.html',
    controller: 'UserController'
})

.otherwise({   // This is when any route not matched
    controller: 'ErrorController'
}) })

И затем UserController как UserController ниже:

.controller('UserController', ['$scope','$routeParams', function ($scope,$routeParams) {
    // $routeParams used for get query string value

    //var loc = window.location.href;
    //var id = loc.slice(loc.lastIndexOf('/'), loc.length).split('/')[1];
    $scope.Message = "This is ORDER Page with query string id value =" + $routeParams.userid;
}])

Но я всегда получаю "undefined" для параметра $routeParams.userid

Что не так в моем коде? Пожалуйста, помогите спасибо!

  • 1
    Просто удалите # из условия когда. Вам это не нужно.
  • 0
    Спасибо, но это все еще "неопределено".
Показать ещё 2 комментария
Теги:
angularjs-routing

1 ответ

1
Лучший ответ

Вот рабочий пример:

<!DOCTYPE html>
<html ng-app="app">

  <head>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.7/angular.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.7/angular-route.js"></script>
  </head>

  <body>
    <h1>Hello Plunker!</h1>

    <a href="/Home/User/11">user 11</a>
    <a href="/Home/User/12">user 12</a>

    <div ng-view></div>

    <script>
      var app = angular.module('app', ['ngRoute']);

      app.config([
          '$locationProvider', '$routeProvider',
          function ($locationProvider, $routeProvider) {

              $locationProvider.html5Mode({
                  enabled: true,
                  requireBase: false
              }).hashPrefix('!');

              $routeProvider
                .when('/Home/User/:userid', {
                    template: '<pre>{{ message }}</pre>',
                    controller: 'UserController'
              });
          }]);

      app.controller('UserController', ['$scope','$routeParams', function ($scope, $routeParams) {
          $scope.message = "userid = " + $routeParams.userid;
      }]);
    </script>
  </body>

</html>

JSBin http://output.jsbin.com/geluli

Вы можете узнать больше о маршрутизаторе по умолчанию здесь (хорошие примеры + тесты) https://docs.angularjs.org/api/ngRoute/service/$route

  • 0
    Спасибо сбулин!
  • 0
    Приятно! Но .hashPrefix('!') самом деле не требуется ?!

Ещё вопросы

Сообщество Overcoder
Наверх
Меню