Question

我试图创建一个联系表单来发送带有消息的电子邮件。

我对Angular Express Node

很新

这是控制器代码：

'use strict';

/**
 * @ngdoc function
 * @name exampleApp.controller:ContactUsCtrl
 * @description
 * # ContactUsCtrl
 * Controller of the exampleApp
 */
angular.module('exampleApp')
.controller('ContactUsCtrl', ['$scope', '$http', '$animate', function($scope, $http, $animate) {

  var self = this;
  self.sendMail = sendMail;

  function sendMail () {

    var req = {
     method: 'POST',
     url: '/contact_us',
     headers: {
       'Access-Control-Allow-Headers': 'Origin, X-Requested-With, Content-Type, Accept'
     },
     data: 
      { 
        contactName : this.contactName,
        contactEmail : this.contactEmail,
        contactMsg : this.contactMsg
      }
    }

    $http(req).
      success(function (data, status, headers, config){
        console.log('success');
      }).
      error(function (data, status, headers, config){
        console.log('error');
      });

      console.log(req);

  };

}]);

这是我的App.js

var subdomain = require("express-subdomain");
var express = require("express");
var bodyParser = require("body-parser");
var methodOverride = require('method-override');
var morgan = require('morgan');
var nodemailer = require('nodemailer');
var app = express();
var router = express.Router();

//Example Admin page
router.get('/', function(req, res){
  res.render('admin.html');
});

app.use(subdomain('admin', router));

//Config
app.set('views', __dirname + '/app');
app.use(morgan("combined"));
app.use(bodyParser.urlencoded({extended: false}));
app.use(methodOverride());
app.engine('html', require('ejs').renderFile);

//Example client page
app.get('/', function(request, response) {
  response.render('index.html');
});

app.use(express.static(__dirname + '/app'));

var port = process.env.PORT || 5000;

app.listen(port, function() {
  console.log("Listening on " + port);
});

当我提交表单时，出现以下消息时出现错误： POST http://localhost:5000/contact_us 404 (Not Found)

在AngularJS上制作联系表格需要做些什么呢？

修改

这些是我的路线：

'use strict';

var xhrDelay = 1200;

angular.module('exampleApp', ['angularSpinner', 'ui.router', 'angular-ui-view-spinner'])
  .config(['$stateProvider', '$urlRouterProvider', function ($stateProvider, $urlRouterProvider, $scope) {
    $urlRouterProvider.otherwise('/');

    $stateProvider
      .state('main', {
        url: '/',
        templateUrl: 'views/main.html',
        controller: 'MainCtrl as mc'
        // homepage: 'fixed'
      })
      .state('contact_us', {
        url: '/contact_us',
        templateUrl: 'views/contact_us.html',
        controller: 'ContactUsCtrl',
        controllerAs: 'cu'
      });
  }]);

溶液

我在app.js（服务器代码）中添加了这段代码：

app.post('/contact_us',function(req,res){
  //Your NodeMailer logic comes here
  exports.sendMail = function(req, res) {

    var data = req.body;

    transporter.sendMail({
      from: data.contactEmail,
      to: 'jane@email.com',
      subject: 'Message from ' + data.contactName,
      text: data.contactMsg
    });

    res.json(data);
    };
});

来源：Sending AngularJS form to NodeMailer to send email

有了这个，我不再收到404错误。

Answer 1

您的App.js中需要'/ contact_us'路线。

Answer 2

我在app.js（服务器代码）中添加了这段代码：

app.post('/contact_us',function(req,res){
  //Your NodeMailer logic comes here
  exports.sendMail = function(req, res) {

    var data = req.body;

    transporter.sendMail({
      from: data.contactEmail,
      to: 'jane@email.com',
      subject: 'Message from ' + data.contactName,
      text: data.contactMsg
    });

    res.json(data);
    };
});

来源：Sending AngularJS form to NodeMailer to send email

有了这个，我不再收到404错误。

Angular JS与快递联系表格返回404

2 个答案: