在 MEAN 应用程序中为 Angular 交换把手答案

【问题标题】：Swapping Handlebars for Angular in MEAN app在 MEAN 应用程序中为 Angular 交换把手
【发布时间】：2014-05-24 12:04:38
【问题描述】：

我正在构建一个带有用户身份验证的 MEAN 应用程序，并且我目前正在学习 Angular（我喜欢通过以实用的方式使用我正在学习的任何东西来学习）。无论如何，在我剥离把手视图引擎并将视图文件从 .hbs 更改为 .html 之前，我能够显示当前经过身份验证的用户的用户名，如下所示：

Handlebars: {{user.username}} = req.user.username 并显示当前认证用户的用户名。

我现在使用的是 sendfile，而不是使用 render 来渲染我的页面：

app.get('/dashboard', Auth.ensureAuthenticated, function (req, res) {
    res.sendfile('./app/views/admin.html', req);
});

我想知道如何在 Angular 中呈现当前经过身份验证的用户的用户名。

【问题讨论】：

标签： javascript node.js angularjs express

【解决方案1】：

您可以通过以下方式发送用户信息

使用车把模板设置全局变量。

app.get('/dashboard', Auth.ensureAuthenticated, function (req, res) {
    res.render('admin',{user: user});
});

并在车把模板中添加如下内容

<script type="text/javascript">
     window.user = {{user}};
</script>

在角度服务中包装这个全局

     angular.module('myApp').service('Global', ['$window', function($window){
         function _getUser() {
             return $window.user;
         }

         return {
             user: _getUser()
         };
     }]);

现在在您的控制器中，您可以通过注入全局服务来访问用户数据

   angular.module('myApp').controller('AdminController', ['$scope', 'Global',    function($scope, Global) {
       $scope.user = Global.user;

   }])

用户将在您的角度局部视图中可用。

<div data-ng-controller="AdminController">
    Welcome <span ng-bind="user"></span>
</div>

或者您可以通过 cookie 发送信息。在angular服务中读取_getUser函数里面的cookie值后，删除cookie。
或者你可以发送一个 ajax 请求来获取 Angular 服务中的数据。

【讨论】：