angular不会将数据传递给节点

时间:2016-09-26 20:08:02

标签: angularjs node.js express

该应用的目的是比较两个文本框中的两个值,如果它们相同则不添加到列表中:

这是我的nodeexpress app中的EJS文件:

<input autofocus type="text" name="result1" class="form-control" id="result1" placeholder="Enter Airport Code or City Name" ng-autocomplete="result1" details="details1" options="options1" ng-model="result1">
<input type="text" name="result2" class="form-control" id="result2" placeholder="Enter Airport Code or City Name" ng-autocomplete="result2" details="details2" options="options2" ng-model="result2">

<div class="alert alert-danger" ng-show="invalid">

<strong>Source and Destination can not be same</strong>
</div>

<div class="form-group">
<button  class="btn btn-default" ng-click="addItem()">Add to Itinerary</button>
</div>
<ul>
    <li ng-repeat="x in products | reverse">{{x}}</li>
</ul>
<div class="col-lg-4">
<ul>
    <li ng-repeat="y in products2 | reverse">{{y}}</li>

public / angularjs / validate.js文件

  angular.module( "myApp", ['ngAutocomplete']).controller("myController",function ($scope, $http) {

            $scope.result1 = '';
            $scope.options1 = null;
            $scope.details1 = '';


            $scope.result2 = '';
            $scope.options2 = null;
            $scope.details2 = '';


            $scope.products = [];
            $scope.products2 = [];

            $scope.valid = false;
            $scope.invalid = true;

            $scope.addItem = function () {


                $http({

                            method : "POST",
                            URL : '/validate',
                            data : {
                                "result1" : $scope.result1,
                                "result2" : $scope.result2
                            }

                }).success(function(data){

                            //checking the response data
                            if(data.statusCode == 401){

                                $scope.invalid = false;
                                $scope.valid = true;

                                    $scope.products.push($scope.result1);
                                    $scope.products2.push($scope.result2);

                            }else{
                                $scope.invalid = true;
                                $scope.valid = false;
                            }

                }).error(function(error){

                    $scope.valid = true;
                    $scope.invalid = true;

                });

            }


        });


        angular.module( "myApp").filter('reverse', function() {
           return function(items) {
             return items.slice().reverse();
           };
        });


        angular.module( "ngAutocomplete", []).directive('ngAutocomplete', function($parse) {

            return {

              scope: {
                details: '=',
                ngAutocomplete: '=',
                options: '='
              },

              link: function(scope, element, attrs, model) {
                var opts

                var initOpts = function() {

                  opts = {}
                  if (scope.options) {
                    if (scope.options.types) {
                      opts.types = []
                      opts.types.push(scope.options.types)
                    }
                    if (scope.options.bounds) {
                      opts.bounds = scope.options.bounds
                    }
                    if (scope.options.country) {
                      opts.componentRestrictions = {
                        country: scope.options.country
                      }
                    }
                  }
                }
                initOpts()


                var newAutocomplete = function() {
                  scope.gPlace = new google.maps.places.Autocomplete(element[0], opts);
                  google.maps.event.addListener(scope.gPlace, 'place_changed', function() {
                    scope.$apply(function() {

                        scope.details = scope.gPlace.getPlace();

                      scope.ngAutocomplete = element.val();
                    });
                  })
                }
                newAutocomplete()

              }
            };
          });

路由/ validate.js

exports.execute = function(req, res){

                var result1 = req.param("result1");
                var result2 = req.param("result2");

                var json_responses;

                if( result1 === result2 ){
                    json_responses = {"statusCode" : 200};
                    res.send(json_responses)
                }else
                {
                    json_responses = {"statusCode" : 401};
                    res.send(json_responses);
                }

            };

app.js

                    var express = require('express');
var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');

var routes = require('./routes/index');
var users = require('./routes/users');

var validate = require('./routes/validate');

var app = express();

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');

// uncomment after placing your favicon in /public
//app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

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

app.post('/validate', validate.execute);

// catch 404 and forward to error handler
app.use(function(req, res, next) {
  var err = new Error('Not Found');
  err.status = 404;
  next(err);
});

// error handlers

// development error handler
// will print stacktrace
if (app.get('env') === 'development') {
  app.use(function(err, req, res, next) {
    res.status(err.status || 500);
    res.render('error', {
      message: err.message,
      error: err
    });
  });
}

// production error handler
// no stacktraces leaked to user
app.use(function(err, req, res, next) {
  res.status(err.status || 500);
  res.render('error', {
    message: err.message,
    error: {}
  });
});


module.exports = app;

0 个答案:

没有答案