Angularjs PHP $http 并在控制器中填充 $scope 数据答案

【问题标题】：Angularjs PHP $http and populating $scope in a controller with dataAngularjs PHP $http 并在控制器中填充 $scope 数据
【发布时间】：2014-07-20 20:16:27
【问题描述】：

好的，我们开始吧。我有一个 angularjs 平台，我想从外部 php 文件调用我的控制器范围内的数据。这是原始代码。

.controller("morrisChartCtrl", ["$scope",
        function ($scope) {
            return $scope.mainData = [{
                month: "2013-01",
                xbox: 294e3,
                will: 136e3,
                playstation: 244e3
            }, {
                month: "2013-02",
                xbox: 228e3,
                will: 335e3,
                playstation: 127e3
            }, {
                month: "2013-03",
                xbox: 199e3,
                will: 159e3,
                playstation: 13e4
            }, {
                month: "2013-04",
                xbox: 174e3,
                will: 16e4,
                playstation: 82e3
            }, {
                month: "2013-05",
                xbox: 255e3,
                will: 318e3,
                playstation: 82e3
            }, {
                month: "2013-06",
                xbox: 298400,
                will: 401800,
                playstation: 98600
            }, {
                month: "2013-07",
                xbox: 37e4,
                will: 225e3,
                playstation: 159e3
            }, {
                month: "2013-08",
                xbox: 376700,
                will: 303600,
                playstation: 13e4
            }, {
                month: "2013-09",
                xbox: 527800,
                will: 301e3,
                playstation: 119400
            }], $scope.simpleData = [{
                year: "2008",
                value: 20
            }, {
                year: "2009",
                value: 10
            }, {
                year: "2010",
                value: 5
            }, {
                year: "2011",
                value: 5
            }, {
                year: "2012",
                value: 20
            }, {
                year: "2013",
                value: 19
            }], $scope.comboData = [{
                year: "2008",
                a: 20,
                b: 16,
                c: 12
            }, {
                year: "2009",
                a: 10,
                b: 22,
                c: 30
            }, {
                year: "2010",
                a: 5,
                b: 14,
                c: 20
            }, {
                year: "2011",
                a: 5,
                b: 12,
                c: 19
            }, {
                year: "2012",
                a: 20,
                b: 19,
                c: 13
            }, {
                year: "2013",
                a: 28,
                b: 22,
                c: 20
            }], $scope.donutData = [{
                label: "Download Sales",
                value: 12
            }, {
                label: "In-Store Sales",
                value: 30
            }, {
                label: "Mail-Order Sales",
                value: 20
            }, {
                label: "Online Sales",
                value: 19
            }]
        }
    ])

我想使用$http 从将生成为 JSON 格式的单个 php 文件中获取每个范围的代码，而不是 js 文件中的内联数据。

这种格式有什么问题

.controller("morrisChartCtrl", ["$scope",
        function ($scope) {
            return $scope.mainData = $http.get('php/mainData.php').success(function (data) {
    $scope.mainData = data;
}), $scope.simpleData = $http.get('php/simpleData.php').success(function (data) {
    $scope.simpleData = data;
}), $scope.comboData = $http.get('php/comboData.php').success(function (data) {
    $scope.comboData = data;
}), $scope.donutData = $http.get('php/donutData.php').success(function (data) {
    $scope.donutData = data;
})
        }
    ])

只是想找出正确的结构

【问题讨论】：

tutorials.jenkov.com/angularjs/ajax.html
问题是什么？您已经了解 $http，阅读文档，浏览文档教程代码，其中包含示例......换句话说，做一些研究。
我想我要问的是，如果我有内联代码，那么创建 $http 驱动版本的结构是什么，如下所示

标签： javascript php json angularjs

【解决方案1】：

$http.get() 得到的结果是一个 Promise 对象。避免将$http.get() 的结果分配给范围变量。

.controller("morrisChartCtrl", ["$scope",
  function ($scope) {
    var mainDataPromise = $http.get('php/mainData.php');
    mainDataPromise.success(function (data) {
      $scope.mainData = data;
    }); 

    var simpleDataPromise = $http.get('php/simpleData.php');
    simpleDataPromise.success(function (data) {
      $scope.simpleData = data;
    });

    var comboDataPromise = $http.get('php/comboData.php');
    comboDataPromise.success(function (data) {
      $scope.comboData = data;
    })

    var donutDataPromise = $http.get('php/donutData.php');
    donutDataPromise.success(function (data) {
      $scope.donutData = data;
    });
  }
])

【讨论】：

当我替换代码时，我丢失了所有数据，要么它没有返回数据，要么数据格式不正确，我试图弄清楚这一点。我真的把显示的数据放入一个 php 文件并使用 echo ' the data '；不确定这是否正确，或者即使文件路径是问题