Node.js Girl
  1. Node.js Girl
  3. Comment établir une connexion avec Angular.js et Node.js?
Intereting Posts
Que faut-il faire lorsque le débit alloué est dépassé? Récupère les champs sélectionnés dans .populate () waterline-postgresql .populate (‘fieldName’, {select: }) Mongoose stream retourne quelques résultats pour la première fois nodejs http encoding Le module de noeud pm2 peut-il redémarrer l’application après un crash automatiquement Karma test runner – ne parvient pas à capturer le chrome ‘Erreur: 422 «Entité non traitable» attendue, 200’ OK ‘ Comment capturer des messages http à partir de la bibliothèque de nœuds de demandes avec Fiddler problème de fichier har browsermob-proxy avec webdriverio Le corps de la demande de publication Python apparaît vide dans le serveur de nœud lors de son envoi La nouvelle valeur de cookie de socket.io ne fonctionne pas? Impossible d’obtenir le tableau de sous-documents Mongoose.js à remplir Streaming / Piping JSON.ssortingngify output dans Node.js / Express Extensions Nodejs Erreur de segmentation uv_queue_work Expressjs ne charge pas les feuilles de style sur heroku, donnant 500 erreurs

Comment établir une connexion avec Angular.js et Node.js?

J’ai un simple panneau d’administration qui contient une forme. J’essaie de mettre à jour le contenu de ce formulaire via Angular.js et Node.js. Si j’accomplis cela, je pourrai lire les données du formulaire et le rendre également sur la page de couverture.

Ce formulaire lit les données de: “/json/form-data.json” : 

[{ "name" : "BigTitleLine1", "content" : "APP TITLE 1" }, { "name" : "BigTitleLine2", "content" : "APP TITLE 2" }];

Angular Service obtient les données de ce fichier json: 

 ServiceModule.factory('serviceFormData', ['$resource', function ($resource) { return $resource(rootPath("/json/form-data.json"), {}, { query: { method: 'GET', isArray: true } }); }]);

Angular Controller assigne les données au modèle: 

 ctrl.controller('formCtrl', ['$scope', '$rootScope', 'serviceFormData', function($scope, $rootScope, serviceFormData) { $scope.model = {}; serviceFormData.query(function(data) { $scope.model.formData = data; }); ]);

Je peux afficher les vraies données sur le code HTML et enregistrer les modifications apscopes au modèle:

J’ai créé un serveur Node.JS Express sur mon hôte local. Il peut aussi lire et écrire des fichiers. 

 var express = require('express'), fs = require('fs'), app = express(); app.use(express.static(__dirname)); // i can create "localhost:3000/test" page and show this json data over there app.get('/test', function (req, res, next) { res.json({ some: "aq literal" }); }); // i can create "./json/test.json" file and write what i want. fs.writeFile("./json/test.json", "Hey there!", function(err) { if(err) { return console.log(err); } }); var server = app.listen(3000);

J’essaie d’écrire un fichier JSON qui inclut le modèle de la forme angular soumise. Comme ça: 

 [{ "name" : "BigTitleLine1", "content" : "I've edited this json from my angular form which is on the client side." }, { "name" : "BigTitleLine2", "content" : "APP TITLE 2" }];

Comment construire cette connexion entre Angular.js et Node.js?

Vous devez modifier votre fabrique pour gérer le nouvel appel à Node afin de mettre à jour le fichier (ou créer une nouvelle fabrique): 

 ServiceModule.factory('serviceFormData', ['$resource', function ($resource) { return $resource('/update', {}, { update: { method: 'PUT' } }); }]);

Ensuite, vous devez mettre à jour le contrôleur angular avec la méthode de mise à jour: 

 var json = new serviceFormData.update($scope.item); json.$update(function (response) { $scope.success = true; }, function (response) { $scope.error = response; });

Et enfin, vous devriez le gérer par nœud avec un nouvel itinéraire: 

 var bodyParser = require('body-parser'); app.use(bodyParser.json()); app.use(bodyParser.urlencoded({ extended: true })); app.put('/update', function (req, res) { var arr = [] for (var index in req.body){ arr.push(req.body[index]) } var jsonData = JSON.ssortingngify(arr, null, 2); fs.writeFile("./json/test.json", jsonData, function(err) { if(err) { return console.log(err); } res.json({ success: true }); }); });

Je ne l’ai pas testé mais c’est la voie à suivre.