Question

我正在使用第三方客户端登录，然后每个路由都有<ng-view>，这意味着所有导航只会在<ng-view>内重新加载。

然后我有一个全局页脚，显示每个部分的用户登录信息所以我把它放在<ng-view>之下。会是这样的

<ng-view></ng-view>
<div ng-controller="FooterCtrl">User logged-in Info</div>

我的问题登录后FooterCtrl将不显示登录的用户信息，因为登录仅重新加载<ng-view>未完全重新加载。（除非我使用F5手动刷新页面。）

我的问题是，

如何在用户未登录时隐藏FooterCtrl
我应该把FooterCtrl放在哪里？

Answer 1

在FooterCtrl控制器中，密切关注路线变化。

每当路由更改时，都会获取有关用户是否已登录的信息。

因此，您的代码看起来有点像这样 - 在您的控制器中，请使用以下代码：

$scope.$on('$routeChangeStart', function (next, current) {
    //Get the current state of the user log in.
    //Accordingly, set the variable

    //If user is logged in
    $scope.userIsLoggedIn = true;

    //Else
    $scope.userIsLoggedIn = false;
});

因此，您的范围现在可以在每次路由更改时都知道用户是否已登录 - 我认为，如果您的应用程序配置正确，则每次将不同的模板加载到ng-view时。

现在，您的观点可以简单如下：

<div ng-view>
</div>

<div ng-controller="FooterCtrl">
    <footer ng-show="userIsLoggedIn">
        <!-- Info to show when user is logged in -->
    </footer>

    <footer ng-hide="userIsLoggedIn">
        <!-- Info to show when user is NOT logged in -->
    </footer>
</div>

因此，您的页脚会根据用户的登录状态显示数据。每次视图模板更改时，控制器都将确定登录状态并相应地显示视图。

Angularjs处理登录和登录页面

1 个答案: