返回defer.promise没有按预期工作

时间:2017-03-29 16:39:11

标签: angularjs

我已经开始做Angular三天了,我无法理解承诺的概念。

我正在尝试创建一个工厂来在两个控制器之间共享JSON数据。数据表示序列化的SQL数据表。

工厂使用$ http

获取数据
library(shiny)

# Define UI for application that draws a histogram
ui <- fluidPage(

   # Sidebar with a slider input for number of bins 
   sidebarLayout(
      sidebarPanel(
# drj's changes START block 1
        #selectInput('states', 'Select states', choices = c(1,2,4))
        selectInput('states', 'Select states', choices = NULL)
# drj's changes END block 1
      ),

      # Show a plot of the generated distribution
      mainPanel(
         plotOutput("distPlot")
      )
   )
)

# Define server logic required to draw a histogram
server <- function(input, output, session) {

  observe({


#drj's changes START block 2
    #val <- c(1,2,3)
    #names(val) <- c("a","b","c")
    #updateSelectInput(session, 'states', 'Select states', choices = names(val[1]))
    val <- as.data.frame(cbind(c("_1","_2","_3"), c(4, 4, 6)))
    names(val) <- c("a","b")
    val$b <- as.numeric(val$b)
    idx <- sapply(val, is.numeric)
    val2 <- val[,idx, drop = FALSE]
    updateSelectInput(session, 'states', 'Select states', choices = names(val2))
#drj's changes END block 2
  })
}

# Run the application 
shinyApp(ui = ui, server = server)

第一个控制器应将数据显示为HTML表

var app = angular.module('myApp', ['ngAnimate', 'ngSanitize', 'ui.bootstrap']);

app.factory('Tableau', function ($http, $q) {
    var obj = {};
    obj.getTable = function (page) {
            var temp = {};
            var defer = $q.defer();
            $http.get('api/Table/' + page).then(function (resolve) {
                defer.resolve(resolve.data);
            });
            return defer.promise;
    }
    return obj;
});

这是带有ng指令的HTML代码

app.controller("TableController", function ($scope, Tableau) {
    $scope.elements = Tableau.getTable(2); // get the first ten rows with row id >= n x 10 (in this case 2 x 10)
});

我从控制器调用$ http没有问题,但是当我将代码移到工厂时,$ scope.elements包含一个promise对象而不是我期望的JSON对象。

我没有实现第二个控制器,它会为表创建一个分页(使用ui-bootstrap

  1. 如何在从工厂返回对象之前等待$ http完成?

  2. 如果无法做到这一点,我怎样才能一次性共享从服务​​器检索到的数据?

  3. 提前致谢。

2 个答案:

答案 0 :(得分:1)

在使用结果之前,您需要等待承诺完成。这意味着使用.then()

app.controller("TableController", function ($scope, Tableau) {
    Tableau.getTable(2)
        .then(function (result) {
            $scope.elements = result;
        });
});

你也成了明确的承诺建构反模式的牺牲品。

您工厂的实施更简单:

app.factory('Tableau', function ($http, $q) {
    var obj = {};

    obj.getTable = function (page) {
        return $http.get('api/Table/' + page)
            .then(function (result) {
                return result.data;
            });
    };

    return obj;
});

答案 1 :(得分:1)

在您的控制器中:

$var = new DateTime();
var_dump($var->modify('First Monday May 2017'));

/** Output **/
object(DateTime)#1 (3) {
  ["date"]=>  string(26) "2017-05-08 00:00:00.000000"
  ["timezone_type"]=>  int(3)
  ["timezone"]=> string(3) "UTC"
}