Question

我在body标签上有一个ApplicationController。在这个控制器里面，我在服务器的响应上设置用户名。不知何故，用户名变量仅在HomeController中可用，而HomeController目前尚未实现。

的index.html

<body ng-controller="ApplicationController">
    Welcome {{username}}.
    <div ng-view></div>
</body>

home.html的

<div>You are logged in as {{username}}.</div>

的Javascript

angular.module('APP', [
  'ngRoute',
  'APP.services',
  'APP.controllers',
  'APP.auth'
])
.config(function($routeProvider, $httpProvider) {
    $httpProvider.interceptors.push('httpRequestInterceptor');

    $routeProvider.when("/", {
      templateUrl: "/static/partials/home.html",
      controller: "HomeController"
    });

    return $routeProvider.otherwise({
      redirectTo: "/"
    });
  }
);

angular.module("APP.controllers", ['ui.bootstrap.modal'])

.controller("HomeController", function($scope, $rootScope) {
})

.controller('ApplicationController', function($scope, $rootScope, USER_ROLES,
                                              AUTH_EVENTS, AuthService, $modal,
                                              UserService) {
  $scope.username = null;

  $scope.setCurrentUser = function(user) {
    $scope.username = user.username;
  }

  $rootScope.$on(AUTH_EVENTS.loginSuccess, function(event) {
    UserService.get().then($scope.setCurrentUser);
  });
});

生成输出

<body>
  Welcome
  <div>You are logged in as AceUser</div>
</body>

更新1

如果我选择ApplicationController元素然后运行angular.element($0).scope()，我可以看到范围和用户名。但它仍未在文件中输出。

更新2

使用Django生成index.html。 Django正在处理模板变量而不是将其作为输出发送。解决方案是使用{％verbatim％}标记包装变量。对于那些也遇到这个问题的人，我会把它留在这里。

Answer 1

不太确定为什么它在HomeController中有效。我为您准备了一个工作Plunk来比较您的代码。

    angular.module('APP', [
   'ngRoute',
   'APP.controllers'
   ])
   .config(function($routeProvider, $httpProvider) {
   $routeProvider.when("/", {
      templateUrl: "home.html",
      controller: "HomeController"
    });

    return $routeProvider.otherwise({
      redirectTo: "/"
    });
  });

angular.module("APP.controllers", [])

.controller("HomeController", function($scope, $rootScope) {})

.controller('ApplicationController', function($scope, $rootScope) {
  $scope.username = null;

  $scope.setCurrentUser = function(user) {
    $scope.username = user.username;
  }

  $scope.setCurrentUser({username: 'bob'});

});

Angular中的范围没有正确继承

更新1

更新2

1 个答案: