【问题标题】:failed bind angularJS variable to nodejs将angularJS变量绑定到nodejs失败
【发布时间】:2017-03-05 12:31:18
【问题描述】:

我在将我的 angularJS POST 参数发送到我的 nodejs 服务器时遇到问题...我已经看到了许多与此相关的主题,在这里尝试了所有方法,但没有任何效果(还有更多):

How to pass parameter in Angularjs $http.post

Angular: how to pass $scope variables into the Node.js server.

How to pass client-side parameters to the server-side in Angular/Node.js/Express

How to pass data from AngularJS frontend to Nodejs backend?

我涉及到这个问题的相关代码, 车把模板:

<div ng-controller='questions'>
  <form method="POST" class="form-inline" class="my-search-menu">
    <button ng-click="search()" class="btn btn-default glyphicon glyphicon-search" type="submit" style="background-color: #85C1E9;"></button>
    <input style="direction: rtl" type="text" name="search_text" ng-model="search_text" class="form-control" placeholder="Search" aria-describedby="sizing-addon3">
  </form>
</div>

AngularJS:

var myapp= angular.module('myapp', []);

myapp.controller("questions", function($scope,$http) {
$scope.search = function () {
    var formdata = {search_text : $scope.search_text};
    $http.post('/search', {params: formdata})
        .success(function (data, status, headers, config) {
            $scope.questions = data;
        })
        .error(function(data, status, header, config){
            $scope.onerror = "Data: " + status;
    });
    console.log(formdata);
    };
});

NodeJS:

app.post('/search', function (req,res,next){
  var search_text = req.query.params.formdata.search_text;
  console.log(req);
  Question.find({$text: {$search: search_text}}).exec(function (err, questions){
    res.json(questions);
  });
});

【问题讨论】:

  • 你想做什么,错误是什么?
  • 想要从 REST API 获取 json 格式数据...错误是我传递给节点服务器的 angularJS 变量未定义。

标签: javascript angularjs node.js web mean-stack


【解决方案1】:

您遗漏了几点。首先在angar控制器中

$http.post('/search', {params: formdata})

将在节点服务器中发送{params:formdata} 作为请求正文。因此在服务器端您将收到作为request.body 的数据。在这种情况下接收身体的正确方法是..

app.post('/search', function (req,res,next){
      var search_text = req.body.params.search_text;
      //TODO
    });

如果你想将数据作为参数发送,那么在控制器中编写这样的函数......

$http({
        method: 'POST',
        url: '/search/'+paramData,
      }).then(function successCallback(response) {
        //TODO
      }, function errorCallback(error) {
        //TODO
      });

在服务器端...

app.post('/search/:searchText', function (req,res,next){
      var paramData = req.params.searchText;
      //TODO
    });

【讨论】:

  • 在服务器部分您真的需要将搜索文本添加到路由中吗?看起来它只是字符串“searchText”而不是变量本身
  • 是的,您需要添加部分:searchText,看看我是如何添加路线的:searchText。这意味着它将作为参数传递。从前端,您将获得值别名为 searchText。
  • 有人知道该怎么做吗?无论我改变了什么,除了最后一部分发布到路线'/search/:searchText'之外,还尝试了他的建议,因为我不明白为什么或如何正确地做到这一点 - 在示例中 searchText 将只是字符串“搜索文本”
  • 我需要在angular文件中将其更改为吗?
  • 是的。发送参数的正确方式是第二种方式。在 angular 文件中, paramData 是您要发送到服务器的实际数据。在服务器端 :searchText 是存储它的变量。
猜你喜欢
  • 2013-08-17
  • 1970-01-01
  • 2014-09-05
  • 1970-01-01
  • 1970-01-01
  • 2017-09-16
  • 2016-09-02
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多