req.user数据未显示在视图中

时间:2016-06-11 00:14:11

标签: angularjs node.js express passport.js passport-local

我有一个带护照本地状态的快速服务器,本地护照本地护照和本地护照本身也是安装的。我希望以json的形式访问当前用户模型以读取和写入数据。我头疼的是,对象不想在我的视图中显示数据。它没有错误加载,我无法理解发生了什么。请帮帮我!

这是我的快速配置:

var express = require('express'),
app = express(),
morgan = require('morgan'),
bodyParser = require('body-parser'),
cookieParser = require('cookie-parser'),
expressSession = require('express-session'),
hash = require('bcrypt-nodejs'),
mongoose = require('mongoose'),
path = require('path'),
passport = require('passport'),
localStrategy = require('passport-local').Strategy,
port = process.env.PORT || 8080,
User = require('./app/models/user'),
routes = require('./app/routes/api');

mongoose.connect('mongodb://localhost:27017/dashboard');
app.use(express.static(__dirname + '/src'));
app.use(morgan('dev'));

app.use(bodyParser.urlencoded({extended: true}));
app.use(bodyParser.json());
app.use(cookieParser());
app.use(require('express-session')({
secret: 'keyboard kat',
resave: false,
saveUninitialized: false
}));
app.use(passport.initialize());
app.use(passport.session());

passport.use(new localStrategy(User.authenticate()));
passport.serializeUser(User.serializeUser());
passport.deserializeUser(User.deserializeUser());

app.use(function (req, res, next) {
res.header('Access-Control-Allow-Origin', '*');
res.header('Access-Control-Allow-Methods', 'GET', 'POST');
res.header('Access-Control-Allow-Methods', 'X-Requested-With, content-          type, Authorization');
next();
});

app.use('/user', routes);

app.get('/', function (req, res) {
res.sendFile(path.join(__dirname + '/src/views', 'index.html'));
});

app.use(function (req, res, next) {
var err = new Error('not found :(');
err.status = 404;
next(err);
});

app.use(function (err, req, res) {
res.status(err.status || 500);
res.end(JSON.stringify({
    message: err.message,
    error: {}
}));
});

app.listen(port);
console.log('Magic happens on port ' + port);

我用来提取数据的路线:

router.get('/data', function (req, res) {
res.send(req.user);
});

Сhromedevtools返回正确的对象:

Dev Tools

角度服务:

angular.module('main')
.factory('MenuService', function ($http) {

    function getData() {
        $http.get('/user/data')
            .success(function (data) {
                return data;
            });
    }

    return {
        info: getData
    }
});

控制器:

angular.module('main')
.controller('menuController', function ($mdSidenav, MenuService) {
    var vm = this;

    vm.toggleMenu = function () {
        $mdSidenav('menu').toggle();
    };

    vm.info = MenuService.info();

});

最后的观点:

<md-toolbar layout="row" ng-controller="menuController as menu">
<div class="md-toolbar-tools">
    <md-button class="md-icon-button md-primary" ng-click="menu.toggleMenu()" aria-label="open menu">
        <md-icon md-svg-icon="../../assets/img/hmg.svg"></md-icon>
    </md-button>
    <h1>Dashboard</h1>
    <span flex></span>
    <h1>{{menu.info.name}}</h1>
</div>
</md-toolbar>

没有任何反应:(没有观点,没有错误,绝对没有:

Browser

2 个答案:

答案 0 :(得分:0)

您需要返回承诺  处理异步调用或使用 pub-sub模式来告知您的数据到达时。

正在发生的是 getData 函数被调用,在后台获取数据,但它不会返回给getData调用者的调用者。为什么?因为在getData内没有返回任何内容。需要退货。

这是一个回复承诺的解决方案。

更新:抱歉,有时我忘记$http会返回一个包含数据的resp对象。根据这个更新了代码。 所以在您的服务中:

angular.module('main')
.factory('MenuService', function ($http) {

    function getData() {
        return $http.get('/user/data'); //no preprocessing just returning the result of the http call
    }

    return {
        info: getData
    }
});

在您的控制器中

angular.module('main')
.controller('menuController', function ($mdSidenav, MenuService) {
    var vm = this;

    vm.toggleMenu = function () {
        $mdSidenav('menu').toggle();
    };
    //todo this will be called whenever menuController gets initiated
    //better to put into user action or run only one time...
    MenuService.info().then(function(resp){
       console.log(resp); //here is the response
       vm.info = resp.data;
    }, function(err){
       //todo when no data arrived
    });

    return vm;
});

根据docs

,不推荐使用.success.error
  

$ http遗留承诺方法成功与错误已被弃用。请改用标准方法。如果$ httpProvider.useLegacyPromiseExtensions设置为false,则这些方法将抛出$ http / legacy错误。

答案 1 :(得分:0)

您可以在异步调用中编写此语句。

return vm;

你的vm只是this对象。你不需要从控制器返回它。

您的controller as语法会自动将this对象绑定到范围对象。

请将其删除。

让保持陈述原样。

MenuService.info().then(function(resp){
       console.log(resp); //here is the response
       vm.info = resp.data;
    }, function(err){
       //todo when no data arrived
    });