0

我正在使用 Angular-Smart-table 为项目生成一个充满事件的表。

添加和删​​除列是一项要求，我们有一个单独的 UI 组件来执行此操作。这个 UI 组件是一个模式，它是我想要包含的列的复选框。但是，当此模式关闭时，我的智能表会变为空白，并且在我更新表列标题时不会更新新的选择。

这是控制器中处理 tablesettings 事件的代码。

 function activate(){
        vm.$on('tablesettings', function(event, args){
            setTimeout(function(){
                console.log(args);
                vm.tableColumns = {};
                angular.forEach(args.columns, function(v,k){
                    vm.tableColumns[v.value] = v.label;
                });
                vm.tableRows = [];

                addTabletoScope(TableService.cache.data);
            },30000)


        });

    }


    function addTabletoScope(td){
        vm.tableRows = [].concat(vm.tableData);
        console.log(vm.tableColumns);
    }

这是表格的 HTML：

    <div class="gTable" style="overflow-x:auto; height:100%;">
<table style="width: 100%" st-table="tableRows" st-safe-src="tableData" st-pipe="tableControl.getPages()" st-pagination-scroll class="table table-striped scroll">
    <thead>
    <tr>
    <th ng-repeat="(key, val) in tableColumns">{{val}}</th>
    </tr>
    </thead>

    <tbody>

    <tr ng-repeat="row in tableRows">
        <td >{{row.eventDateString}}</td>


        <td >{{row.cocom}}</td>
        <td >{{row.country}}</td>
        <td >{{row.province}}</td>
        <td >{{row.district}}</td>
        <td >{{row.iedType}}</td>
        <td >{{row.incidentType}}</td>
        <td>{{row.eventId}}</td>



       <!-- <td ng-hide="cityremove">{{row.city}}</td>-->

    </tr>


    </tbody>
    <tfoot>
    <tr>
        <td colspan="4" class="text-center">
            <div  st-pagination="" st-items-by-page="pageNumbers" st-displayed-pages="7"></div>
        </td>
    </tr>
    </tfoot>
</table>
    </div>

这是我广播 tablesettings 事件的地方，

function handleWidgetSettingsReturn(response) {
            switch (response.widgetType) {
                case "chart": {
                    if (!angular.isUndefined(response.widgetSubType) &&
                        response.widgetSubType !== scope.item.settings.widgetSubType) {
                        scope.item.settings.widgetSubType = response.widgetSubType;
                    }
                    break;
                }
                case "table": {
                    if (!angular.isUndefined(response.widgetOptions)) {
                        $log.info("Table settings set");
                        scope.item.settings.widgetOptions = response.widgetOptions;
                        console.log(scope.item.settings.widgetOptions);
                        scope.$broadcast('tablesettings', scope.item.settings.widgetOptions);
                    }
                }
            }
        }

这是模态实例正常关闭的地方。

function ok() {
        var result = {
            widgetType: $scope.widgetConfig.widgetType,
            widgetSubType: ($scope.widgetConfig.getWidgetSubtype())? $scope.widgetConfig.getWidgetSubtype() : undefined,
            widgetOptions: ($scope.widgetConfig.generateWidgetOptions())? $scope.widgetConfig.generateWidgetOptions() : undefined
        };

        $modalInstance.close(result);

感觉我的模板没有回来，也没有刷新或改变，即使我用模态响应更新了 scope.tableColumns。$scope.apply() 对我也不起作用，刷新方法也不起作用。

我不确定为什么当我为该模式点击确定时我的智能表会变为空白。

4

0 回答 0