Angular $routeParams is empty

Angular $routeParams is empty

本文关键字：empty is routeParams Angular      更新时间：2023-09-26

我有一个url，它将通过Rails传递到我的Angular代码中。然而，当我尝试在url中提取一个参数时，它显示为空白。有人能帮我吗？

示例url:http://localhost:3000/events/event1

Plnkr：http://plnkr.co/edit/yG8wAZHhgPtH2PBFzql3?p=preview

角度：

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:

events.html.erb

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

application.html.erb（总体布局）

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

编辑：按照建议，我已经将ng-app和ng-view移动到布局中，并且只将div保留在events.html.erb

中

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

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

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

这是因为您包含了带有ng-controller指令的控制器，而不是带有ng-view指令的控制器。它一定是这样的：

<body ng-app="EventsApp">
    <div ng-view></div>
</body>

在events.html.erb:中

<div>
    {{greeting}}
</div>
相关文章：