用Angular处理登录/访客用户界面的语言方式

Question

假设我有一个网站，其中大部分网页可以通过或不通过登录访问，但登录时会有一个sidenav。

处理这个问题的惯用方法是什么？

1. 创建两个单独的模板/控制器
2. 相同的模板/控制器NG-IF/NG-显示
3. 任何更好的主意，也许？

Answer 1

您不需要单独的模板，因为无论使用哪种方式，您都需要使用某种ng-if/ng-show来包含模板，而不取决于用户是否登录。

将侧边栏放在单独的指令或模板中是有意义的，只是为了保持代码的模块化，但您不必为自己想要做的事情做到这一点。

我通常会做这样的事情：

HTML：

<div class="sidebar" ng-show="isLoggedIn()"> 

</div> 

控制器：

angular.module('app').controller([ 
    'authenticationService', 
    function(authenticationService) { 
     $scope.isLoggedIn = function() { 
      return authenticationService.isLoggedIn(); 
     }; 
    } 
]); 

或者你可以做到这一点使用一个指令，如：

angular.module('app').directive('isVisibleToCurrentUser', [ 
    'authenticationService', 
    function(authenticationService) { 
    return { 
     restrict: 'A', 
     link: function(scope, element) { 
     if(authenticationService.isLoggedIn()) { 
      element.show(); 
     } else { 
      element.hide(); 
     } 

     authenticationService.on('loggedOut, function() { 
      element.hide(); 
     }); 
     } 
    }; 
    } 
]); 

的好处指令是关于用户是否可以看到该元素的所有逻辑都封装在指令中。虽然这需要某种事件，如authenticationService.on('loggedOut')知道何时隐藏元素。