javascript - 使用 Angularjs 的动态网格

Question

我的代码位于不同的层中: 1. 一个工厂，包含我所有的 $http 请求，并返回 promise 。 2. 一个 Controller ，使用 then 处理该 Promise，将其分配给 $scope 变量，然后将其显示在 gridview 上。

现在我正在尝试创建一个指令来处理 Gridview，并将数据作为要在链接函数中处理的 attr 传递并显示它。通过这个，我试图实现代码的可重用性。问题是，由于异步调用，作用域上的数据变量当然变空了，对此有什么更好的方法呢？

angular.module('parametrosModule').factory('apiMethods', ['$http', 'apiUrl', function ($http, apiUrl) {

return {
    getBleh: function () {
               return $http.get(apiUrl.urlBase + '/getBleh');
       },

       }

    }])
 .controller('transactionController', ['apiMethods', function (apiMethods) {

  var vm = this;

  function getData() {
           apiMethods.getBleh()
              .then(function (response) {
                 vm.data = response.data;
              });
        };
}])
.directive('dynamicGrid', [function () {
    return {
        restrict: 'E',
        templateUrl: 'app/directives/dynamicGrid.html',
        scope: {
            data: '=',
            headers: '='
        },
        link: function (scope, elem, attrs) {
            var vm = this;

            vm.values = scope.data;

            vm.headers = scope.headers;

        }
    }
}]);

这是我格式化后的代码，问题是由于 api 调用迟到，数据属性变为空。整个想法是创建一些在从应用程序中的任何人接收到 x 数据后自行构建的东西。谢谢!!

Answer 1

您不需要为此使用链接函数。 here是一个工作示例。您只需告诉模型要绑定(bind)到什么，即可将模型实际绑定(bind)到指令的 $scope:

scope: {
  data: '=data',
  headers: '='
}