Question

我试图将我的数据从角形式发送到服务器控制器所在的位置我使用这些数据来修改我的json文件，看起来他们使用的是ngResource 沟通后端和FrontEnd数据，但我无法理解它是如何工作的以下是我认为可能有助于解释我的问题的代码部分。

machine.client.view.html

<section data-ng-controller=’MachineController’>
  <form class=’form-horizontal’ data-ng-submit=’create()’ novalidate>
    <fieldset>
      <div class="form-group">
        <label class="control-label" for="projectName">Name of the project</label>
        <div class="controls">
          <input type="text" class="form-control" id="projectName" data-ng-model="projectName" placeholder="my_first_project">
        </div>
        <div class="form-group">
          <input type="submit" class="btn btn-primary"></input>
        </div>
    </fieldset>
  </form>
</section>

machine.client.routes.js

(function() {
  'use strict';
  //Setting up route
  angular
    .module('machine')
    .config(routeConfig);

  routeConfig.$inject = ['$stateProvider'];

  function routeConfig($stateProvider) {
    // Machine state routing
    $stateProvider
      .state('machine', {
        url: '/machine',
        templateUrl: 'modules/machine/client/views/machine.client.view.html',
        controller: 'MachineController',
        controllerAs: 'vm'
      });
  }
})();

machine.client.controller.js

(function() {
  'use strict';

  angular
    .module('machine')
    .controller('MachineController', MachineController);

  MachineController.$inject = ['$scope'];

  function MachineController($scope) {
    var vm = this;


    // Machine controller logic
    $scope.create = function() {
      console.log("Testing the functionalites");
      console.log(this.projectName);
    };
    init();

    function init() {}
  }
})();

machine.server.controller.js

'use strict';
/**
 * Module dependencies.
 */
require('require-xml');
var path = require('path'),
  mongoose = require('mongoose'),
  initialJsonFile = require('../resources/config.json'),
  finalJsonFile = './modules/machine/server/config/config1.json',
  updatedJson = require('../config/config1.json'),
  js2xmlparser = require('js2xmlparser'),
  jsonfile = require('jsonfile'),
  errorHandler = require(path.resolve('./modules/core/server/controllers/errors.server.controller')),
  _ = require('lodash');
/**
 * Converting xml to json
 */
exports.updatingJsonConfig = function(req, res) {

  //I do need here to get data from angular form the string 'testing      description' it was only used to test the modifications
  initialJsonFile.project.projectName = 'testing description';

};

machine.server.routes.js

'use strict';
var machine = require('../controllers/machine.server.controller');
module.exports = function(app) {
  app.route('/testing').get(machine.updatingJsonConfig);
};

注意：我在表单中使用了一个输入来解释问题，但它是一个多字段的形式

Answer 1

在MEAN堆栈中，您在服务器端（节点）使用Express来设置HTTP服务器，并且您的Angular前端应用程序通过HTTP协议与服务器通信。它没有包含在您发布的代码中，但我假设您的服务器端代码中设置了http服务器。

之类的东西

make menuconfig

在本地计算机上，您将能够在localhost：8080上访问这样设置的http服务器。

var server = http.createServer(app); server.listen(8080);

这一行定义了一个路由处理程序，在这个上下文中它表示＆＃34;当你点击localhost：8080 /使用HTTP GET REQUEST进行测试时执行machine.updatingJsonConfig。

updatesJsonConfig是一个快速中间件函数，可以访问req和res对象。如果要响应HTTP请求，则需要在updatesJsonConfig函数末尾调用res.send（），并将其作为参数发送。

然后在客户端，您需要向服务器发出http请求并处理响应。最简单的方法是使用$ http服务：

app.route('/testing').get(machine.updatingJsonConfig)

ngResource发出相同的HTTP请求，你真的不需要它。

服务器上的res.send（），客户端中的$ http.get。

编辑：

要通过HTTP发送表单数据，您需要使用$http.post而不是$ http.get发出POST请求。 GET请求没有机构。

在服务器端，您需要更改路由以处理POST请求

$http.get('/localhost:8080/testing') .then(function(response) { // do something with the response });

您还需要在快递中加入body-parser模块，并且您有可用的req.body。

Answer 2

最后在@marton回答之后我提出了一个尊重meanjs框架的解决方案，前端控制器（角度控制器）和后端控制器（快速控制器/节点）之间的连接是通过角度服务的帮助完成的。为了澄清我的答案，当用户点击machine.client.view.html上的提交按钮时，将调用一个创建函数，该函数在 machine.client.controller.js（请参阅下面的新client.controller.js）但是为了发送数据，我们将使用视图中的数据创建一个对象（此处创建的对象是confInput），我们将此对象传递给服务函数createConfig，它将使用包含http请求post的资源对象的角度服务将我们的数据发布到我们的服务器控制器。最后最重要的是修改我们的服务器路由，以便它可以支持发布请求（app.route（'/ testing'）。post（machine.updatingJsonConfig）;

之后我们可以通过req.body在我们的服务器控制器中访问我们的数据。

<强> machine.client.service.js

(function () {
  'use strict';

  angular
    .module('machine')
    .factory('machineService', machineService);

  machineService.$inject = ['$resource'];

  function liferayService($resource) {
      var resource;

    resource = $resource('/testing',null,{
           createConfig : {
             method:'POST'
           }
    });

    // Public API
    return resource;
  }
})();

<强> machine.client.controller.js

(function() {
  'use strict';

  angular
    .module('machine')
    .controller('machineController', machineController);

  MachineController.$inject = ['$scope','machineService'];

  function MachineController($scope,machineService) {
    var vm = this;


    //machine controller logic
    $scope.create = function () {
      // Creation of the object which contains user configurations input
      var confInput = {};
       confInput.nomProjet = this.nomProjet;
      
      machineService.createConfig(confInput,function (resource, headers) {
       //this function is executed when the post is succesful
      },function (response) {
        //this function is executed when the post returns an error
        console.error(response);
      });

    };

    init();

    function init() {
    }
  }
})();

如何将数据从angularjs控制器发送到meanjs中的服务器（nodejs）控制器

2 个答案: