Question

我的网格列宽度在ng-grid中出现问题。我的问题是我不知道列会是什么（它们是在与值同时从服务调用中检索的。我的Json对象有两个属性。列名称的字符串数组和然后是一个2d数组的值。目前列的大小不适合列标题。我理解列将调整大小以适应行数据但是如果没有返回结果会怎么样。那么你就搞得一团糟。我试过它就这样我我没有设置网格选项，直到我有我的数据，但后来得到一个未定义的错误。我看到另一个帖子，其中的解决方案是在div标签中使用ng-if所以网格不会加载，直到你想要它。因为网格仍然在if语句满足之前仍然尝试加载，但是没有用。下面是我的代码。任何想法？还有，我的ng-if是这样的：ng-if =“contentAvailable”。还添加了一个屏幕截图我的期望是出现一个水平滚动条。 enter image description here

    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;
}]);

Answer 1

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

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

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

1 个答案: