在 slickgrid 中访问 AngularJS 变量

Question

我已将 SlickGrid 与我的 Angular JS 应用程序集成。早些时候，我用普通的硬编码 javascript 代码填充网格数据[见下文]。但现在我需要从 REST 服务获取网格数据，该服务在我的 Angular Js 控制器中调用并保存在对象数组中。如何访问在我的 SlickGrid javascript 代码中的 angular js 中定义的变量 [array]。

我尝试用 Angular js 代码中定义的数组替换下面的“数据”，但它不起作用。任何人都可以在这里帮助我。

    $(function () {
/*  need to comment out this code once I can use the array defined in angular Js */
        var data = [];
        for (var i = 0; i < 500; i++) {
          data[i] = {
            title: "Task " + i,
            duration: "5 days",
            percentComplete: Math.round(Math.random() * 100),
            start: "01/01/2009",
            finish: "01/05/2009",
            effortDriven: (i % 5 == 0)
          };
        }

        grid = new Slick.Grid("#myGrid", data, columns, options);
      })    

更新：这是我的 slickgrid 代码。我正在调用 REST 服务来获取 $scope.data1 中的数据，然后使用它来填充 slickgrid，但我得到的是一个空的 slickgrid。但是，如果我对 $scope.data1 中的数据进行硬编码，它就可以工作。我错过了什么？谁能帮帮我吗。我花了一整天的时间来解决这个问题。

$scope.populateGridData  =  function()

        FetchPopulation.get({id:1} , function(response ) {

            $scope.data1 = [];
            for (var i = 0; i < response.PopulationList.population.length; i++)
                $scope.data1[i] = {
                    firstName: response.PopulationList.population[i].firstName,
                    lastName: response.PopulationList.population[i].lastName,
                    designation: response.PopulationList.population[i].designation,
                    department: response.PopulationList.population[i].department,
                    salary: response.PopulationList.population[i].salary,
                    rating: response.PopulationList.population[i].rating,
                    joiningDate: response.PopulationList.population[i].joiningDate,
                    employeeId: response.PopulationList.population[i].employeeId,
                    employeeType: response.PopulationList.population[i].employeeType,
                    manager: response.PopulationList.population[i].manager,
                    permanent: (i % 5 == 0),
                    percentComplete: Math.round(Math.random() * 100)
                };
/*
            $scope.data1= [{employeeId:"12345", firstName: "aaa", lastName: "bbb" , designation:"Business Analyst" , department:"FSI" ,
                salary:"120000",rating:"1" , joiningDate:"12/8/2013" , employeeType:"permanent" , manager:"aaaa" }];
*/

            var grid = new Slick.Grid("#myGrid", $scope.data1, $scope.columns, $scope.options);

            $scope.grid.setSelectionModel(new Slick.CellSelectionModel());


        });
    };

Answer 1

您是否在此处手动输入了注释行？因为它不是有效的 JSON，所以一切都必须转义 [{employeeId:"12345" 应该是 [{"employeeId":"12345",... ，即使不是这样，您的数据集似乎也是错误的。我没有像您那样使用没有 DataView 的 SlickGrid，但是如果您采用基本示例并复制这段代码（取自 SlickGrid example2:

$(function () {
    for (var i = 0; i < 5; i++) {
      var d = (data[i] = {});

      d["title"] = "<a href='#' tabindex='0'>Task</a> " + i;
      d["duration"] = "5 days";
      d["percentComplete"] = Math.min(100, Math.round(Math.random() * 110));
      d["start"] = "01/01/2009";
      d["finish"] = "01/05/2009";
      d["effortDriven"] = (i % 5 == 0);
    }

    grid = new Slick.Grid("#myGrid", data, columns, options);
})

它很可能会起作用...在返回您的代码之前先尝试一下，但我强烈怀疑您的 JSON 结果可能不像您认为的那样有效...现在在您尝试了基本示例并且您之后回到您的代码，您可以尝试通过以下方式验证您的 JSON 输出：JSONLint 只需复制并粘贴您的 JSON 并点击验证。