0

因此,我可以在成功的重定向中通过 mongoose passport-local 显示用户名:

app.get('/profile', isLoggedIn, function (req, res) {
    res.render('profile.html', {
        user: req.user
    });
    console.log(req.user.local.username) //correct username for the session
});

...然后使用它在 profile.html 中显示:

<p><%= user.local.username %></p>

...但是当尝试在我的 ng-view 中显示相同的内容时:

<div ng-view ng-class="slide" class="slider"></div>

...通过我的路线 example.html 模板:

<p>welcome <%= user.local.username %></p>

..它显示为:不是正确的用户名...

是否不可能在 ngView 中包含这些信息?是否有解决方案将此信息包含在我的模板中?我试图用 $http 建立一个工厂:

angular.module('userService', [])

.factory('Users', function($http) {
    return {
        get : function() {
            return $http.get('/profile');
        }
    }
});

...但它返回了整个 html,所以不是正确的解决方案。

任何指导都将一如既往地受到欢迎和赞赏,因此提前致谢!

编辑回应: 获取价值并路由它并不是真正的问题。问题只是让它在 ngView 中正确显示。

这是我更新的代码:

Rules.get()
        .success(function (data) {
            $scope.rules = data;
            console.log('Rules.get()');
            console.log(data);

            Users.get()
                .success(function (username) {
                    Users.username = username;
                    console.log('Users.get()')
                    console.log(username)
                });
        });

...和...

angular.module('userService', [])

.factory('Users', function ($http) {
    return {
        get: function () {
            console.log('userService')
            return $http.get('/profile/user');
        }
    }
});

...从以下位置返回:

app.get('/profile/user', function (req, res) {
    console.log('profile/user')
    console.log(req.user.local.username)
    res.json(req.user.local.username);

});

这给了我相同且正确的用户名,但是我该怎么称呼它才能让它显示在 ngView 中?如果放置在实际的 ngView div 之外,它会显示得很好。

从上面的 {{username}} {{rules.username}} = 没有。ngView 模板中的服务参数的名称应该是什么(我假设它是一个全新的 $scope)?

4

2 回答 2

1

问题是否可能与Angular 和 Express 路由重复?

您可以在 ng-views 中包含 ejs 模板(如<%= value %>)(参见上面的链接),但这里有其他三个选项。

许多人将服务器数据传递给 Angular 并让 Angular 模板化他们的视图(例如在 MEAN 堆栈中)。这意味着您不需要在您的角度部分中使用 ejs 模板。以下是将数据从您的服务器传递到 Angular 的三种方法(感谢这篇博文:http: //mircozeiss.com/how-to-pass-javascript-variables-from-a-server-to-angular/):

1. 平均法

第一个是 MEAN 堆栈中使用的内容。您可以在 ng-view 周围的包装器中发送 Angular 应用程序所需的所有数据:

<!-- head -->
<!-- body -->
<!-- ng-view element -->

<script type="text/javascript">window.user = <%- user %>;</script>

<!-- rest of js -->
<!-- /body -->

这样,您的 Angular 应用程序可以通过如下提供程序访问数据:

angular.module('myApp')
.factory('UserData', [
    function() {
        return {
            user: window.user
        };
    }
]);

2.使用$http和api

第二个是通过 restful api 提供这些数据,并通过提供者使用$httpor请求数据$resource

angular.module('myApp')
.factory('UserData', [
    function($http) {
        $http.get('/userAPI').success(function(data){
            return data;
        });
    }
]);

3. 使用 ng-init

最后,您可以在 ng-init 中使用服务器端模板。

<div ng-init="user = <%- data %>"></div>

这会将数据放在$scope.user您的 Angular 应用程序中使用。

于 2014-02-02T01:49:08.140 回答
1

因此,对于可能正在搜索的其他人,这是我的解决方案:

用户.js:

angular.module('userService', [])

.factory('Users', function ($http) {
    return {
        get: function () {
            console.log('userService')
            return $http.get('/profile/user');
        }
    }
});

路由.js

$scope.username = {};    
.controller('cntrl', function ($scope, Users) {
        getCurrentUser(Users, $scope);
    })

        function getCurrentUser(Users, $scope) {
        Users.get()
            .success(function (username) {
                $scope.username = username.user;
            });
    }

服务.js:

app.get('/profile/user', function (req, res) {
    console.log('profile/user')
    console.log(req.user.local.username)
    res.jsonp({ user:req.user.local.username});

});

然后在 html 中(在任何 ngView 模板中):

<span class="username">{{username}}</span>

关键是:

$scope.username = {};
于 2014-02-04T23:20:20.363 回答