AngularJS UI ng-grid не рисует текст содержимого и пустой при использовании внутри директивы

Я разрабатываю один элемент управления SearchAndSelect (директива AngularJS), который содержит собственную страницу слайдера ng-grid. Все работает, данные извлекаются, количество строк поступает в сетку, но сетка не показывает текст.

SearchAndSelectDirective.js

App.directive('searchAndSelect',
    function () {
        return {
            restrict: 'E',
            templateUrl: "/app/directives/searchAndSelect.html",
            controller: "searchAndSelectController",
            transclude: false,
            scope: {
                currentNode: '='
            }, 
            compile: function() {
               // return true;
            }
        };
    }
);

SearchAndSelect.html

<button class="btn" ng-click="openSliderPage()">Add/Remove {{EntityName}}</button>

<div id="divSlide" class="sliderDiv">
    <div class="sliderHeader" ng-model="partialPageHeading">
        <span class="sliderHeaderLabelOriginal">{{partialPageHeading}}</span>

    </div>

    <div>
        <div class="gridStyle" ng-grid="gridOptions"></div>

        <div class="modal-footer">
            <input ng-model="filterOptions.filterText" />
            <button class="btn btn-info" ng-click="getPagedDataAsync()">Filter</button>
            <button class="btn btn-primary" ng-click="add()">Update</button>
            <button class="btn btn-warning" ng-click="cancnel()">Cancel</button>
        </div>
    </div>

    <!--<ng-include src="svcSliderView"></ng-include>-->
</div>

У него есть собственный контроллер, который извлекает данные асинхронно. Число строк генерируется в сетке, сетка видна. У меня есть код внутри контроллера, чтобы отметить некоторые выбранные строки, и это происходит. Но только содержимое не отображается. Если я вижу исследование элемента браузера, я вижу, что данные есть.

SearchAndSelectController.js

   $scope.filterOptions = {
            filterText: "",
            useExternalFilter: false
        };
        $scope.pagingOptions = {
            pageSizes: [50, 100, 200],
            pageSize: 50,
            currentPage: 1
        };
        $scope.getVehListParams = function () {
            var params = { PageNo: $scope.pagingOptions.currentPage, PageSize: $scope.pagingOptions.pageSize };
            params.CalculateTotal = false;
            if (!$scope.totalCount) {
                params.CalculateTotal = true;
            }
            params.FilterText = '';
            if ($scope.filterOptions.filterText) {
                params.FilterText = $scope.filterOptions.filterText;
            }
            return params;
        };
        $scope.getPagedDataAsync = function () {
            var vehListGetParams = $scope.getVehListParams();
          seVehicleResource.get(vehListGetParams,
                function (result) {
                    $scope.dataList = result.DataList;

                    if (result.TotalCount || result.TotalCount == 0) {
                        $scope.totalCount = result.TotalCount;
                    }
                    //mark already added rows in left as selected.
                    $timeout(function () {
                        if ($scope.planSelected) {
                            _.each($scope.planSelected.Vehicles, function (vehicle) {
                                var vIdx = $.map(result.DataList, function (obj, index) {
                                    if (obj.VehicleId == vehicle.VehicleId) {
                                        return index;
                                    }
                                    return null;
                                });
                                if (vIdx && vIdx.length > 0) {
                                    $scope.vehicleExisted.push(result.DataList[vIdx[0]]);
                                    $scope.gridOptions.selectItem(vIdx[0], true);
                                }
                            });
                        }

                    });

                }, function (error) {
                    console.log(error);
                });

        };
        $scope.$watch('pagingOptions', function (newVal, oldVal) {
            if (newVal !== oldVal && (newVal.currentPage !== oldVal.currentPage || newVal.pageSize !== oldVal.pageSize)) {
                $scope.getPagedDataAsync();
            }
        }, true);


        $scope.allSelected = false;
        $scope.gridOptions = {
            data: 'dataList',
            enablePaging: true,
            showFooter: true,
            showFilter: true,
            columnDefs: [{ field: 'Make', displayName: 'Make', width: '35%' }, { field: 'Model', displayName: 'Model', width: '35%' }, { field: 'BeginYear', displayName: 'Begin Year', width: '15%' }, { field: 'EndYear', displayName: 'End Year', width: '15%' }],
            totalServerItems: 'totalCount',
            pagingOptions: $scope.pagingOptions,
            filterOptions: $scope.filterOptions.filterText,
            showSelectionCheckbox: true,
            afterSelectionChange: $scope.afterSelectionChange,
        };