ajax调用结束时将数据传递给angularjs中新创建的指令答案

【问题标题】：Passing data to newly created directive in angularjs when ajax call is overajax调用结束时将数据传递给angularjs中新创建的指令
【发布时间】：2023-03-28 01:34:01
【问题描述】：

我正在尝试从光滑的网格中创建自定义指令。这是我到目前为止所做的。

angular.module('app')
  .directive('myGrid',function () {
      return {
        restrict: 'E',
        link: function (scope, el, attrs) {

          var data = [];
          var columns = [
            {id: "title", name: "Title", field: "title", width: 160, cssClass: "cell-title", editor: Slick.Editors.Text},
            {id: "desc", name: "Description", field: "description", width: 400, editor: Slick.Editors.LongText},
            {id: "duration", name: "Duration", field: "duration",minWidth: 160, editor: Slick.Editors.Text},
            {id: "start", name: "Start", field: "start", minWidth: 160, editor: Slick.Editors.Text},
            {id: "finish", name: "Finish", field: "finish", minWidth: 160, editor: Slick.Editors.Text}

          ];

            scope.grid = new Slick.Grid(el, scope.data, columns, scope.gridOptions);
        }
    }
 });

这就是我使用指令的方式！！

 <my-grid id="myGrid" style="height:500px;" grid-options="gridOptions" ></my-grid>

这是我的控制器

$http.get(url)
            .success(function(response, status, headers, config) {
              $scope.data = response.data;
         });

问题是http调用结束后，网格中没有看到任何数据。

【问题讨论】：

标签： ajax angularjs angularjs-directive angularjs-scope slickgrid

【解决方案1】：

这是因为你的控制器和指令都是并行执行的。

您需要的是让指令等待控制器完成其 API 调用。

您可以借助 $emit 来实现这一点。

在控制器中，

var response = some_json;
$scope.$emit('controllerUpdate', response);

在指令中，用

括起您的代码

$scope.$on('controllerUpdate',function(event, response){
    // Do your work here
});

【讨论】：