ng-grid 列大小问题。和 ng-if 问题答案

【问题标题】：ng-grid column size problems. And ng-if issueng-grid 列大小问题。和 ng-if 问题
【发布时间】：2013-10-31 23:52:55
【问题描述】：

我在 ng-grid 中的网格列宽有问题。我的问题是我不提前知道列将是什么（它们与值同时从服务调用中检索。我的 Json 对象中有两个属性。列名的字符串数组和然后是值的二维数组。目前列的大小不适合列标题。我知道列会调整大小以适应行数据，但是如果没有返回结果怎么办。那你就一团糟。我试着做它，所以我在获得数据之前不必设置网格选项，但随后出现未定义的错误。我看到另一篇文章，其中解决方案是在 div 标签中使用 ng-if，这样网格在您想要它之前不会加载。这也不起作用，因为在满足 if 语句之前网格仍然尝试加载。下面是我的代码。有什么想法吗？另外，我的 ng-if 是这样的：ng-if="contentAvailable"。还添加了一个屏幕截图. 我的期望是显示一个水平滚动条。

    app.controller('mainController',function($scope,dataFactory){
    $scope.contentAvailable = false;
    $scope.gridOptions = {
        columnDefs: 'columns',
        showGroupPanel: true
    };

    $scope.url = 'http://example.com';

        if (typeof String.prototype.startsWith != 'function') {
            String.prototype.startsWith = function (str) {
                return this.indexOf(str) == 0;
            };
        }

    $scope.Fetch = function () {
        dataFactory.Fetch($scope.url,$scope.config).success(function (blah) {
            var result = $scope.transformJsonDataSet(blah);

        })
          .error(function (error) {
              $scope.result = error;
          });
    };

    $scope.transformJsonDataSet = function (ds) {
        var tmp = angular.fromJson(ds);
        var fieldNames = tmp.FieldNames;
        var fieldValues = tmp.FieldValues;

        var columns = [];

        for (var i = 1; i < fieldNames.length; i++) {
            if (fieldNames[i].startsWith('DECODE_') == false) {
                columns.push({ field: fieldNames[i], displayName: fieldNames[i], cellClass: 'headerStyle'});
            }
        }

        $scope.columns = columns;

        $scope.contentAvailable = true;
        return ds;
    };
});

app.factory('dataFactory', ['$http', function ($http) {
    var dataFactory = {};
    dataFactory.Fetch = function (url,config) {
        return $http.get(url,config);
    };

    return dataFactory;
}]);

【问题讨论】：

标签： angularjs ng-grid

【解决方案1】：

您的控制器中没有声明 $scope.columns？
尝试定义一个 $scope.columns 变量并为其分配一个空变量：

app.controller('mainController',function($scope,dataFactory){
    $scope.contentAvailable = false;
    $scope.columns = [];
    $scope.gridOptions = {
        columnDefs: 'columns',
        showGroupPanel: true
    };
 /* */

【讨论】：

添加空范围变量后没有变化。