angularjs/एक्सप्रेस ऐप में किसी फ़ॉर्म से डेटा कैसे प्राप्त करें

हाय दोस्तों मुझे पता है कि angularjs/एक्सप्रेस ऐप में किसी फॉर्म से डेटा कैसे प्राप्त करें? उदाहरण के लिए

index.js मार्ग

app.post('/register', sessionHandler.handleSignup);

handleSignup function
is there any way to get the data without using req.body ? because angularjs prevent me submit the form so i have to think another way to get the data.

 this.handleSignup = function(req, res, next) {
        "use strict";

        var email = req.body.email,
         confirmEmail = req.body.confirmEmail,
         password = req.body.password,
         confirmPassword = req.body.confirmPassword,
         firstName = req.body.firstName,
         lastName = req.body.lastName,
         penName = req.body.penName,
         publicUsername = req.body.publicUsername;

       //set these up in case we have an error case
        var errors = {'email': email,'publicUsername': publicUsername,'firstName': firstName,'lastName': lastName,'penName': penName};
        if (validateSignup(publicUsername, password, confirmPassword, email, confirmEmail, errors)) {
            users.addUser(email, password, firstName, lastName, penName, publicUsername, function(err, user) {
                "use strict";

                if (err) {
                   //this was a duplicate
                    if (err.code == '11000') {
                        errors['email_error'] = "Email already in use. Please choose another";
                        return res.render("register", errors);
                    }
                   //this was a different error
                    else {
                        return next(err);
                    }
                }

                sessions.startSession(user['_id'], function(err, session_id) {
                    "use strict";

                    if (err) return next(err);

                    res.cookie('session', session_id);
                    return res.redirect('/');
                });
            });
        } else {
            console.log("user did not validate");
            return res.render("register", errors);
        }
    }

controller ( is there any way to make the page stay at the same page if there is an error ? if no error then redirect to "/")

function RegisterCtrl($scope, $http, $location) {
  $scope.form = {};
  $scope.submitPost = function() {
    $http.post('/register', $scope.form).
      success(function(data) {
        $location.path('/');
      });
  };
}

my form

<div class="pure-u-1 text-center">
  <form method="post" class="pure-form pure-form-aligned">
    

Join us today and start write things that matter

{{email_error}}

<div class="pure-control-group"> <input required name="email" ng-model="form.email" class="pure-u-1-3" type="email" placeholder="Email Address"> </div> <div class="pure-control-group">

{{confirmEmail_error}}

<input required name="confirmEmail" ng-model="form.confirmEmail" class="pure-u-1-3" type="email" placeholder="Confirm Email Address"> </div> <div class="pure-control-group">

{{password_error}}

<input required name="password" ng-model="form.password" class="pure-u-1-3" type="password" placeholder="Password"> </div> <div class="pure-control-group">

{{confirmPassword_error}}

<input required name="confirmPassword" ng-model="form.confirmPassword" class="pure-u-1-3" type="password" placeholder="Confirm Password"> </div>

<div class="pure-control-group"> <input required name="firstName" class="pure-u-1-3" ng-model="form.firstName" type="text" placeholder="Your first name"> </div> <div class="pure-control-group"> <input required name="lastName" class="pure-u-1-3" ng-model="form.lastName" type="text" placeholder="and your last name"> </div> <div class="pure-control-group"> <input required name="penName" ng-model="form.penName" class="pure-u-1-3" type="text" placeholder="Pen Name eg:J.R.R. Tolkien"> </div> <div class="pure-control-group"> <input required name="publicUsername" class="pure-u-1-3" type="text" ng-model="form.publicUsername" placeholder="Username eg:gandalf">

https://www.HoneyBooBoo.com/@{{form.publicUsername}}

{{publicUsername_error}}

</div> <div class="pure-u-1 ">
<input type='submit' ng-click="submitPost()" class="pure-button pure-button-secondary pure-u-1-3" value="Register">
</div>
 
  </form>
</div>
0
जोड़ा संपादित
विचारों: 1

3 उत्तर

आपको अपने ऐप में ng-app को परिभाषित करने की आवश्यकता है। फिर डेटा का उपयोग ng-model को संभालने के लिए।

आपके टेम्पलेट इनपुट फ़ील्ड में डेटा को संभालने के लिए डेटा मॉडल होना चाहिए।

ईमेल के लिए पसंद है

<input required name="email" class="pure-u-1-3" type="email" placeholder="Email Address" ng-model="form.email">
0
जोड़ा
मेरे पास पहले से ही मेरे ऐप में एनजी-एप है, समस्या यह है कि इस फॉर्म से डेटा कैसे प्राप्त करें और इसे handleSignup पर पास करें क्योंकि मैं वहां पर सत्यापन करना चाहता हूं और साथ ही साथ अपने डेटाबेस में भी सम्मिलित करना चाहता हूं
जोड़ा लेखक John Lim, स्रोत
खेद है कि मुझे अभी एहसास हुआ कि मैंने प्रश्न में नवीनतम कोड पेस्ट करने की प्रतिलिपि नहीं बनाई है, माफ़ कीजिए, वास्तव में मैंने जवाब में जो कुछ भी बताया है, लेकिन सवाल यह है कि फ़ॉर्म से डेटा को एक जैसे req.body.email i ईमेल डेटा प्राप्त कर सकते हैं लेकिन कोणीय तरीके से
जोड़ा लेखक John Lim, स्रोत
'var ईमेल = req.body.email' कोणीय से डेटा कैसे प्राप्त करें और req.body.email को प्रतिस्थापित करें
जोड़ा लेखक John Lim, स्रोत
नमस्ते @ जयराम, मैंने पहले ही आपके द्वारा दिए गए सुझाव को प्रतिस्थापित कर दिया है। हालांकि जब भी मैं इसे सबमिट करता हूं, तो मुझे सीधे किसी भी सत्यापन के बिना '/' से लिंक करें, क्योंकि मेरे पास मेरे हैंडल सिग्नल में सत्यापन फ़ंक्शन है जिसके लिए फ़ॉर्म से डेटा की आवश्यकता है और मेरा प्रश्न यह है कि कैसे प्राप्त करें फॉर्म से डेटा और इसे (var ईमेल) में पास करें, अब मेरे पास [var ईमेल = req.body.email] है, यह सीधे फॉर्म से डेटा प्राप्त करता है लेकिन angular.js तरीके से कैसे होता है? [[$ http.post ('/ रजिस्टर', $ scope.form)। सफलता (फ़ंक्शन (डेटा) {$ location.path ('/');}); ]] मैं "डेटा" कैसे प्राप
जोड़ा लेखक John Lim, स्रोत
मैंने जवाब में दिया है। कोणीय एनजी मॉडल में डेटा को संभालने के लिए प्रयोग किया जाता है। तो प्रत्येक फ़ील्ड के लिए ng-model = "field-name" असाइन करें।
जोड़ा लेखक Jayram Singh, स्रोत
सबमिट पर ng-click = "submitPost ()"
जोड़ा लेखक Jayram Singh, स्रोत

in your angular controller you can use the data inside ng-model="form.email" with $scope.form.email

तो आप अपने nodejs ऐप को http अनुरोध या अन्य वेबसाइकिलों के साथ भेज सकते हैं।

0
जोड़ा
धन्यवाद, यह वास्तव में मैं क्या देख रहा था
जोड़ा लेखक Gabri Botha, स्रोत

ऐसा लगता है कि आप परंपरागत सर्वर आधारित मॉडल के साथ कोणीय की सिंगल-पेज-एप (एसपीए) अवधारणा को भ्रमित कर रहे हैं। एसपीए के साथ, सर्वर कोई रीडायरेक्टिंग या एचटीएमएल की सेवा नहीं करता है। आपका सर्वर JSON भेजता है, और कोणीय फिर क्लाइंट-साइड के सभी पृष्ठों को प्रस्तुत करता है।

ऐसा लगता है कि अनुरोध ऑब्जेक्ट को आपके सर्वर-साइड पंजीकरण फ़ंक्शन में सही तरीके से पारित नहीं किया जा रहा है, और यही कारण है कि आप req.body तक नहीं पहुंच सकते हैं। आपका कोणीय कोड सही दिखता है।

मैं आपको अपनी परियोजना से कुछ कोड देने जा रहा हूं जो वही करता है जो आप चाहते हैं।

अपने index.js मार्गों के अंदर

var signup = require('./routes/signup');
app.post('/signup', function(req, res) {
    signup(req, res);
});

मार्गों/signup.js

module.exports = function (req, res) {
  validateSignup(req.body, function(error, data) {
    if(error) {
      res.send(400, error.message);
    } else {
      res.send(JSON.stringify(data));
    }
  })
}

function validateSignup(data, callback) {
 //All your validation logic goes here
  if(success) callback(null, newuser);
  else callback(new Error('Registration failed!'), null);
}

आपकी HTML फ़ाइल सार्वजनिक निर्देशिका में

<!DOCTYPE HTML>

  <head>
    <title>Sample Registration Page</title>
    <link href="styles/bootstrap.css" rel="stylesheet">
    <link href="styles/signin.css" rel="stylesheet">
  </head>
  <body>
    <div class="container" ng-controller="SignupCtrl">
      <div class="alert alert-danger" ng-if="errorMessage">{{errorMessage}}</div>
      <form class="form-signin">
        
        <input type="text" class="form-control" name="username" placeholder="Username" ng-model="User.username" required autofocus>
        <input type="password" class="form-control" name="password" placeholder="Password" ng-model="User.password" required>
        <button class="btn btn-lg btn-primary btn-block" ng-click="register()">Register</button>
      </form>
    </div> <!-- /container -->
    <script type="application/javascript" src="lib/angular/angular.min.js"></script>
    <script type="application/javascript" src="scripts/controllers/register.js"></script>
  </body>
</html>

और अंत में register.js

angular.module('app', [])
.controller('SignupCtrl', function ($scope, $http, $location) {

  $scope.User = {};
  $scope.errorMessage = '';

  $scope.register = function() {
    $http.post('/signup', $scope.User).
    success(function(data) {
      $location.path('/');
    }).error(function(err) {
      $scope.errorMessage = err;
    });
  }
});

मैंने इसका परीक्षण किया है, और जब तक आप सर्वर-साइड पर अपने सभी साइनअप तर्क को सही तरीके से भरते हैं, तो यह आपके लिए भी काम करना चाहिए। नोट: रीडायरेक्ट के लिए सही तरीके से काम करने के लिए, आपको अपना कोणीय रूटिंग सेट अप करने और रीडायरेक्ट करने के लिए एक पृष्ठ बनाने की आवश्यकता होगी।

0
जोड़ा
बहुत बहुत धन्यवाद, यह वही है जो मैं चाहता हूं
जोड़ा लेखक John Lim, स्रोत
हे कॉलिन आपको समझाने के लिए दिमाग में है "आपको अपने कोणीय मार्ग को स्थापित करने और रीडायरेक्ट करने के लिए एक पृष्ठ बनाने की आवश्यकता होगी।" मेरे लिए ? धन्यवाद
जोड़ा लेखक John Lim, स्रोत
हाय जॉन, आप अपने मार्गों को स्थापित करने के लिए इस ट्यूटोरियल को देख सकते हैं: docs.angularjs.org/tutorial/step_07
जोड़ा लेखक Colin Skow, स्रोत
यहां एक बेहतर ट्यूटोरियल भी है: viralpatel.net/blogs/ & hellip;
जोड़ा लेखक Colin Skow, स्रोत