从 ExpressJS 服务器读取数据以显示在 angular-smart-table 的 pipe/ajax 插件中

Question

我想做什么？ 我正在尝试通过开发一个简单的 Web 应用程序来学习 Javascript & MEAN 堆栈。在该应用程序中，我尝试在具有以下规格的 Web 应用程序中使用 angular-smart-table 的 "pipe/ajax plugin"：客户端：AngularJS 服务器端：ExpressJS/NodeJS （使用 Yeoman 生成器创建 "generator-angular-fullstack"）

我面临的挑战： 我 copy/pasted pipe/ajax 插件示例在我的网络应用程序中的智能 table documentation 中给出。此示例具有要在客户端（工厂）的智能 table 中显示的值。我想将这些值移动到可通过 REST API 端点 $http.get('/api/smartTableServer').[=16 访问的服务器控制器文件（smartTableServer.controller.js in the plunker） =]

我在这方面取得了什么成就？ 我能够成功地将数据从服务器控制器文件读取到客户端工厂文件 (smartTableClient.service.js)。但是，当我将它存储在变量 (randomsItems) 中时，变量的值为 "undefined"。我相信 http get 调用稍后执行，因此变量 randomsItems 仍然没有从服务器获取值。你能帮我解决这个问题吗？（即）从服务器控制器 JS 获取 randomsItems 的值并将其显示在视图中。

我的与此问题相关的文件的 Plunker：

`angular.module('myApp').factory('Resource', ['$q', '$filter', '$timeout', '$http', function ($q, $filter, $timeout, $http) {

    //this would be the service to call your server, a standard bridge between your model an $http
// the database (normally on your server)

function getrandomsItems() {  

     var defer = $q.defer();

     $http.get('/api/smartTableServer', { cache: 'true'}).success(

            function(randomsItems) {

                defer.resolve(randomsItems);

                //randomsItems = angular.fromJson(randomsItems);

                //console.log("Success - randomsItems : " + randomsItems);                    
                //console.log("Success - randomsItems.Stringify : " + JSON.stringify(randomsItems));

                return defer.promise;
            }                             
        );

    return defer.promise;
}

function getPage(start, number, params) {

var randomsItems = getrandomsItems(); // This method call returns the value as undefined!!!
...      `

http://plnkr.co/edit/jRdNXuVMrWaymLnxfPnE?p=catalogue

请注意： 我仍然不知道异步脚本是如何工作的，因此不知道延迟和承诺的概念，我认为这是我面临上述问题的原因。我仍在学习 basics.Kindly 帮助。

Answer 1

function getRandomItems() 必须接受必须在 $http.get('/api/smartTableServer', { cache: 'true'}) 的 success 方法内部调用的回调 promise:

function getRandomItems(cb) {  
  $http.get('/api/smartTableServer', {cache: 'true'})
       .success(function(randomItems) { cb(randomItems); });
}

function getPage(start, number, params) {
  getRandomItems(function cb(randomItems) { 
    // do what you want to do with randomItems 
  };
)

或者 return 来自 function getRandomItems() 的 promise 和 :

function getRandomItems(cb) {  
  return $http.get('/api/smartTableServer', {cache: 'true'});
}

function getPage(start, number, params) {
  getRandomItems.success(function(randomItems) { 
    // do what you want to do with randomItems 
  };
)

这里有更多文档：$http General usage

从 ExpressJS 服务器读取数据以显示在 angular-smart-table 的 pipe/ajax 插件中

Read data from ExpressJS server to display in pipe/ajax plugin of angular-smart-table

javascript

ajax

express

angularjs

smart-table