javascript - Angular $routeParams 是空的

Question

我有一个 url，它通过 Rails 传递到我的 Angular 代码中。但是，当我尝试在 url 中获取参数时，它显示为空白。谁能帮帮我？

示例网址:http://localhost:3000/events/event1

请联系:http://plnkr.co/edit/yG8wAZHhgPtH2PBFzql3?p=preview

Angular :

eventsApp = angular.module('EventsApp', ['ngRoute'])


eventsApp.config [
    '$routeProvider'
    '$locationProvider'
    ($routeProvider, $locationProvider) ->
        $locationProvider.html5Mode(true)
        $routeProvider.when '/events/:eventName',
            templateUrl: '../../views/events/events.html.erb'
            controller: 'EventsCtrl'            
        return
]

eventsApp.controller('EventsCtrl',  [ 
    '$scope'
    '$routeParams'
    ($scope, $routeParams) ->       
        console.log($routeParams.eventName) # shows up as undefined
        $scope.greeting = $routeParams.eventName
])

HTML:

事件.html.erb

    <div>
        {{greeting}}
    </div>

application.html.erb(整体布局)

<div id="content" ng-app="EventsApp">
        <div ng-view></div>
        <%= yield %>
    </div>

编辑:按照建议，我将 ng-app 和 ng-view 移到了布局中，只保留了 events.html.erb 中的 div

Answer 1

如果 Karaxuna 指出的错误仍然给你空结果，可能是因为 $routeParams 的异步操作

$routeParams 通常需要一些时间来加载。它正在异步加载。当您尝试使用它时，它可能还没有准备好并且仍然是空的。一种方法是，在路由准备就绪时创建事件监听器。

$scope.$on('$routeChangeSuccess', function() {
  console.log($routeParams.eventName);
});