2015-10-18 24 views
1

我如何在express.js和angular.js之间共享数据,我在express.js中使用ejs视图引擎。在情况下,如果我想共享数据在angular.js的根页,我可以简单地使用:如何在expressjs和angularjs之间共享数据

<%= {{variable from express.js}} %> 

注angular.js页的根页

意思是目标页面express.js中的路由。在我的例子中是index.ejs。

问题
但如果我想使用express.js变量或数组angular.js的指令模板内?

实施例:

index.js

var mysql = require('mysql'); 

exports.index = function (req, res) { 
    var connection = mysql.createConnection({ 
     host: '*****', 
     user: '*****', 
     password: '******', 
     insecureAuth: true 
    }); 

    connection.connect(); 
    connection.query('select * from asterisk.queue_log limit 10', function (err, rows, fields) { 
     if (err) throw err; 
     console.log(rows); 
     res.render('index', { 
      values: rows, 
      title: 'Express', 
     }); 
    }); 

    connection.end(); 
}; 

角指令模板

<div class="half-unit bg-light-ltr" ng-repeat="active in ActiveCalls"> 
    <dtitle>{{active.queueName}}</dtitle> 
    <hr> 
    <div> 

    </div> 

    <h2>{{values}} <!--<i class="fa fa-arrow-up {{test}}"></i>--></h2> 
    <p> 
     <img src="images/up-small.png" alt=""> 412 Max. | 
     <img src="images/down-small.png" alt=""> 89 Min. 
    </p> 
</div> 


我可以在角度(index.ejs)根页使用纳克-INIT =“值=‘<%=值%>’”,然后使用值阵列中的指令模板。我问是否有更好的方法做到这一点。

+1

显然,您必须在Express中创建一个get请求处理程序,以便用您的客户端(即Angular应用程序)的某些ajax请求响应期望的数据。 – Nonemoticoner

回答

1

非常感谢您的评论,我已经在expressjs中创建了REST API,因此处理来自angularjs的http请求,然后从数据库中获取数据并将其返回。

实施例:

app.js

... 
... 
var api = require('./routes/api'); 
app.get('/api/answerdcalls/:id', api.answerdCalls); 
... 
... 

路由/ api.js

/* 
* RESET API Handler . 
*/ 

// Datetime format : 2015-10-18 15:00:00 database 
// Datetime format : Mon Oct 19 2015 12:48:10 GMT+0300 (EEST) javascript 

var mysql = require('mysql'); 

exports.answerdCalls = function (req, res) { 
    var connection = mysql.createConnection({ 
     host: '******', 
     user: '*****', 
     password: '******', 
     insecureAuth: true 
    }); 

    connection.connect(); 

    var d = new Date(); 
    var year = d.getFullYear(); 
    var day = d.getDate(); 
    var hour = d.getHours(); 
    var mon = d.getMonth() + 1; 

    connection.query('select count(*) as count from asterisk.queue_log where time between "' + year + '-' + mon + '-' + day + ' ' + hour + ':00: 00"' + 'and "' + year + '-' + mon + '-' + day + ' ' + hour + ':59:59" ' + ' and event ="CONNECT" ', 
     function (err, rows, fields) { 
      if (err) throw err; 
      console.log(rows[0]); 
      res.send(rows[0]); 

     }); 

    connection.end(); 
}; 

角HTTP工厂

app.factory('ResetCalls', function ($rootScope, $http) { 

    var service = {}; 
    var answerdCallsUrl = 'http://localhost:4000/api/answerdcalls'; 

    service.getAnswerdCalls = function (queueId) { 
     $http.get(answerdCallsUrl + '/' + queueId).success(function (data) { 
      $rootScope.queueTotal = data.count; 
     }); 
    }; 

    return service; 
}); 
在简单的一句话

所以,
-------> angularjs发送HTTP GET
-----> expressjs收到get请求处理它
----->返回取回的数据。