使用 $scope 中的 IIFE 功能在页面加载时创建转换数据答案

【问题标题】：Use IIFE capability in $scope to create transformed data on page load使用 $scope 中的 IIFE 功能在页面加载时创建转换数据
【发布时间】：2014-07-09 05:12:55
【问题描述】：

我对 JavaScript 和 Angular 比较陌生。所以这可能是一个愚蠢的问题，但这里是......

我需要执行一个函数，该函数将对传入数据执行数据转换，并创建页面将使用的数组和对象。执行此功能后，我才能处理我的页面。

请注意，这个函数不会被任何角度工件直接使用，但它的输出会。

请指教。谢谢

$scope.prepped_data = function (data) {
    // code to generate new data structures //
    $scope.data1 = {};
    $scope.data2 = {};
};

【问题讨论】：

标签： angularjs scope iife

【解决方案1】：

像这样创建一个工厂：

angular.module('yourAppModule').factory('yourFactory', function ($http) {
return {
    getData: function() {
        var url = 'http://get-your-data.com/data';
        return $http({
            method: 'GET',
            url: url
        });
    },
}

然后，在控制器中：

angular.module('yourAppModule').controller('yourCtrl', function ($scope, yourFactory) {
        yourFactory.getData().success(function (data) {
        // process your data here
        $scope.data = dataProcessed;
    }
});

然后您可以在视图中使用“数据”来随意显示它，Angular templates 中也有过滤功能。看看吧。

如果您需要在视图中使用自定义函数，您可以将其传递给控制器中的 $scope，就像您所做的那样。

$scope.myFunc = function(data){
   //code here
}

然后在你看来，你可以使用：

<!doctype html>
<html xmlns:ng="http://angularjs.org" ng-app="yourAppModule" id="ng-app">
  <head>
    <script src="bower_components/angular/angular.js"></script>
  </head>
  <body>
    <div ng-controller="yourCtrl">
      {{ myFunc() }}
    </div>

  </body>
</html>

希望对你有帮助，最好的。

【讨论】：

谢谢。会试试这个。所以，在我的页面上，我应该在声明控制器后立即调用该函数，对吗？我目前实际上还没有从服务器中检索数据，而是在我的控制器中将其声明为 $scope.data1 = []。
当然，您可以在控制器中声明一个闭包，并在将数据发送到视图之前随意使用它来处理数据。
好的，你能举个例子吗？您描述的手动调用有效，为什么关闭方法更好？谢谢
您可以在“getData()”的回调中或在控制器本身中处理数据，或者根据需要创建一个闭包，但我认为让您的数据处理总是更干净控制器，以便严格出于 UI 目的保留“视图”。

【解决方案2】：

在服务中

  public method1(){
        var defer = this.$q.defer();
           //Show some loader 
        this.$http({
            method: 'GET',
            url: "www.xyz.com"
        }).success((result) => {
            //Hide loader 
           defer.resolve(result);
        }).error((result) => {
            defer.reject(result);
        });

在控制器中

         method1().then(function(data){//Do your processing})

【讨论】：

感谢您的回复。但是，由于我还没有开始处理 http 部分（我在控制器中存根传入数据），有没有办法让我的控制器继续工作以继续控制器开发和单元测试？