【问题标题】:How angularJS ngResource pass variables to expressJS when doing http request operations to server?对服务器进行http请求操作时,angularJS ngResource如何将变量传递给expressJS?
【发布时间】:2015-03-11 20:52:03
【问题描述】:

这里的问题是,我不知道在使用 ngResource 时如何将一些 scope.data 传递给 expressjs,所以它可以与 express 路由一起使用来向 DB 插入一些东西。

ExpressJS REST

 router.route('/Data')
    .get(function(req,res){
     var username = req.username;
     var collection = db.collection('users');
   collection.find({username:username}).toArray(function (err, doc){
       res.send(doc[0].pets);
   });
 })
   .post(function(req,res){

  !!//I would like to use some data from angular here//!!
    var name = req.body.name;
    var surname = req.bodysurname;

    collection.update({username: username}, {
        $push: {
            "details": {
                name: name,
                surname: surname
             }
         }
     }, function (err, result) {
         if (err) throw err;          
      });
    });

角工厂

 (function() {
   'use strict';

 angular
     .module('App')
     .factory('Factory', function ($resource) {
         return $resource("/Data",{},
             { get:{ method:"GET",
                     cache:true,
                     isArray:true},
              save:{ method:"POST",
                     cache:true,
                     isArray:false
               }});
        });
    })();

Controller.js

这个很好用,我用这个函数和 ng-click()

$scope.load = function(){
        Factory.get(function (data){
           $scope.data = data;
        });
    };

有了这个,我遇到了问题,我看到了 ng-models 名称和姓氏,我想将它们发送到服务器,以便它可以在 REST 路由中用作 req.body.name 和 req.body.surname。

 $scope.AddData = function(){
        Factory.save()
        }); 
      };

我认为应该在AddData这个函数中传递数据,但是我还没有成功。

所以我按照耶稣说的尝试了但没有结果?

 $scope.AddData = function(){
       Factory.save($scope.name) //I tried ({name:$scope.name}) too
     }); 
    };

根据 Jesús Quintana 的建议,我检查了 POST 方法的详细信息,发现角度方面一切正常,我缺少服务器 Express 端的正文解析器扩展

  app.use(bodyParser.json())

所以现在看起来像这样

  app.use(bodyParser.urlencoded({extended: true}));
  app.use(bodyParser.json());

【问题讨论】:

    标签: javascript angularjs express angularjs-resource


    【解决方案1】:

    NgResource 的工作方式类似于具有私有和公共方法的类:

    例如Factory.save()是一个公共方法,你必须将数据传递到服务器中,例如:

    $scope.AddData = function(factoryData){
        Factory.save(factoryData);
        }); 
      };
    

    但也有私有方法,上面的例子和这个是一样的:

    $scope.AddData = function(factoryData){
        var factory = new Factory(factoryData); 
        factory.$save(); // Is the same method but is private because factory is a instance of the factory
        }); 
      };
    

    这两个例子都是有效的方法,但必须以不同的方式使用。

    编辑

    我创建了这个小 plunkr 来查看网络请求:http://plnkr.co/edit/1bdblyrsW0jr7rXIAVNn?p=

    【讨论】:

    • 我根据你的建议更新了我的问题,但没有成功,你能告诉我我做错了什么吗?
    • mmm 第二个必须工作(使用对象 {name: value}),在 plunkr 中测试并且请求包含有效负载。对于您的服务器语法,假设您使用的是 expressjs,请检查您的代码中是否有这个 app.use(express.bodyParser());
    • 编辑答案以粘贴该示例中的 plunkr 和网络请求。
    猜你喜欢
    • 2014-09-28
    • 2014-05-09
    • 1970-01-01
    • 1970-01-01
    • 2020-08-09
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2019-03-02
    相关资源
    最近更新 更多