Question

我有两个控制器，一个页眉和一个页脚控制器。标头控制器基于http://www.thinkster.io/pick/eHPCs7s87O/angularjs-tutorial-learn-to-rapidly-build-real-time-web-apps-with-firebase演示，并处理用户登录/注销。

在每个控制器中我都有代码：

$scope.findFavStore = function(){
    console.log("$scope.auth.id: " + $scope.auth.id);
}

遗憾的是，这个函数错误输出了页脚控制器：“ TypeError：无法读取未定义的属性'id' at Object。$ scope.findFavStore “

Index.html代码段

<header data-ng-include="'views/header.html'" class="navbar navbar-inverse navbar-fixed-top" role="navigation"></header>
<section class="content">
    <section class="container">
        <div ng-view></div>
    </section>
</section>
<footer data-ng-include="'views/footer.html'" class="navbar navbar-default navbar-fixed-bottom"></footer>

HeaderController：

    angular.module('fantasyApp.controllers.header', ['fantasyApp.services.login'])
.controller('HeaderController', ['$scope', '$location', 'loginService', 'angularFire', 'FBURL',
    function($scope, $location, loginService, angularFire, FBURL) {

        $scope.navbarEntries = [{
                "title": "Stores",
                "link": "/stores"
            }
        ];

        $scope.findFavStore = function(){
            console.log("$scope.auth.id: " + $scope.auth.id);
        }

        $scope.$on("angularFireAuth:login", function() {
            angularFire(new Firebase(FBURL+'/users/'+$scope.auth.id), $scope, 'user');
        });

        $scope.logout = function() {
            loginService.logout('/signin');
        };

        $scope.$on('$routeChangeSuccess', function() {
            $scope.navbarEntries.forEach(
                function(data) {
                    data.isActive = ($location.path().indexOf(data.link) == 0);
                }
            )
        })

    }])

FooterController：

    'use strict';

    angular.module('fantasyApp.controllers.footer', ['fantasyApp.services.login', 'fantasyApp.services.users', 'fantasyApp.services.stores'])
.controller('FooterController', ['$scope', 'Users', 'Stores', '$location', 'loginService', 'angularFire', 'FBURL',
    function($scope, Users, Stores, $location, loginService, angularFire, FBURL) {

        $scope.findFavStore = function(){
            console.log("$scope.auth.id: " + $scope.auth.id);
        }

    }])

$ scope变量我缺少什么问题？

Answer 1

每个控制器上的$ scope是不同的。只有子控制器才会继承父级的$ scope。但你的页眉和页脚控制器是兄弟姐妹。

您需要使用$ rootScope，以便从每个控制器访问它：

首先将其添加为依赖项

.controller('HeaderController', ['$rootScope', '$scope', ...

然后将其传递给angularFire

$scope.$on("angularFireAuth:login", function() {
   angularFire(new Firebase(FBURL+'/users/'+$scope.auth.id), $rootScope, 'user');
});

最后，为了更清楚，将$ rootScope添加为页脚控制器的依赖项并访问其auth属性。（考虑到范围继承，这可能不是必需的，但我建议它可以防止冲突）

console.log($rootScope.auth.id);

引自您发布的链接：

angularFire（）有三个参数：对我们想要绑定到模型的数据的引用，我们绑定到的$ scope对象，以及我们绑定到的模型名称的字符串化版本。

将$ rootScope作为第二个参数传递，我们将auth数据绑定到$ rootScope对象，然后可以从应用程序中的任何控制器访问该对象。

页脚控制器中未定义AngularFire $ scope.auth

1 个答案: