Question

我尝试创建一个使用Node服务器作为后端的Web应用程序，并使用Angular从Node服务器获取信息并创建响应式前端。目前，在我的简单应用程序中，我有两个js文件：server.js和controller.js。以下是每个文件的代码：

var express = require("express");
var bodyParser = require("body-parser");
var app = express();
var port = 8006;

app.use(express.static(__dirname));
app.use(bodyParser.json());         
app.use(bodyParser.urlencoded({ extended: true })); 

app.post('/data', function(req, res){
    console.log(req.body);
    res.send("Success!")
    res.status(200);
    res.end();
});

app.listen(port);
console.log("Server running on port " + port);

这是控制器文件：

(function(){
   var app = angular.module("testApp", []);

   var TileController = function($scope){
       // add stuff to $scope as initilization        
   };

   app.controller("TileController", ["$scope", TileController]);    
})();

这段代码有点不完整，因为我不知道该怎么做，但我知道我想用它做些什么。

Angular使用的模型将在节点服务器根据传入的HTTP请求（特别是POST）解析时不断更新。 Node将处理这些请求并以某种方式将数据传递给Angular（在controller.js文件中），这将更新模型，并随之更新视图。

我的问题是将信息从节点服务器传递到controller.js的最佳方法是什么，并在添加信息时更新模型/视图？

Answer 1

我仅使用HTTP请求和git branch ...; git checkout做了一个非常简单的示例，其角度等同于$interval。

将所有文件保存在文件夹中
下载节点模块（express，body-parser）
window.setInterval
open index.html
将一些数据发布到服务器（http://localhost:3000）
index.html应显示POST到服务器的每个数据的列表，延迟~3秒

<强> server.js

node server.js

app.js（有角度）

var express = require('express');
var bodyParser = require('body-parser');
var app = express();

var arr  = [];

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));

app.get('/', function(req, res) {
  res.json({arr: arr});
});

app.post('/', function(req, res) {
  console.log(req.body);
  arr.push(req.body);
  res.end('Data received');
})

app.listen(3000, console.log.call(console, 'Server started.'));

<强>的index.html

var app = angular.module('app', []);

app.controller('MainCtrl', function($scope, $interval, $http) {
  $scope.arr = [];
  var stop = $interval(function() {
    $http.get('http://localhost:3000')
      .then(function(res) {
        $scope.arr = res.data.arr;
      }, function(e) {
        console.error(e);
      });
  }, 3000);
});

将NodeJS与Angular集成的最佳方法

1 个答案: