Таблицы данных angularjs не могут повторно инициализировать ошибку таблицы

Я использую angularjs Datatables и продолжаю сталкиваться с ошибкой.

DataTables Предупреждение: id таблицы = DataTables_Table_0 — невозможно повторно инициализировать Datatable.

У меня есть два часа для запуска отчета, когда пользователь меняет ввод.

$scope.dtInstance = {};
$scope.dtOptions = DTOptionsBuilder.newOptions().withPaginationType('full_numbers')
                                                    .withOption('responsive', true)
                                                    .withOption("autoWidth", false)
                                                    .withDOM('lfrtBip')
                                                    .withButtons(['copy', 'print', 'pdf', 'csv', 'excel']);


$scope.dtColumns = [
    DTColumnBuilder.newColumn('display_name').withTitle('Name'),
    DTColumnBuilder.newColumn('state_desc').withTitle('State'),
    DTColumnBuilder.newColumn('state_Type').withTitle('State Type'),
    DTColumnBuilder.newColumn('adjustedClientStartState').withTitle('State Start Date'),
    DTColumnBuilder.newColumn('adjustedClientEndState').withTitle('State End Date'),
    DTColumnBuilder.newColumn('timeInStateSeconds').withTitle('Seconds'),
    DTColumnBuilder.newColumn('timeInStateMinutes').withTitle('Minutes'),
    DTColumnBuilder.newColumn('timeInStateHour').withTitle('Hours'),
];

$scope.$watch('hours', function (newVal, oldVal)
{
    if (!newVal) return;

    runReport($scope.selectedClient.id, newVal);

});

$scope.$watch('selectedClient', function (newVal, oldVal)
{
    if (!newVal) return;

    runReport(newVal.id, $scope.hours);

});

var runReport = function (clientId, hours)
{
    if (clientId != 'undefined' && clientId != undefined)
    {
        ubernurseService.ClientStateHistory(clientId, hours).then(function (results)
        {


            $scope.states = results.data;

            if (results.data.length > 0)
            {
                $scope.notVisible = false;
            }
            else
            {
                $scope.notVisible = true;
            }
        }, function (error)
        {
            //alert(error.data.message);
        });
    }

}

И в моем шаблоне

<div class="row">
            <div class="col-md-10 col-md-offset-1">
                <table datatable="ng" dt-options="dtOptions" dt-columns="dtColumns" dt-instance="dtInstance" class="table table-hover table-striped">
                    <thead>
                        <tr>
                            <th>Name</th>
                            <th>State</th>
                            <th>State Type</th>
                            <th>State Start Date</th>
                            <th>State End Date</th>
                            <th>Seconds</th>
                            <th>Minutes</th>
                            <th>Hours</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr ng-repeat="state in states">
                            <td>{{state.display_name}}</td>
                            <td>{{state.state_desc}}</td>
                            <td>{{state.state_Type}}</td>
                            <td>{{state.adjustedClientStartState | date:'medium'}}</td>
                            <td>{{state.adjustedClientEndState | date:'medium'}}</td>
                            <td>{{state.timeInStateSeconds}}</td>
                            <td>{{state.timeInStateMinutes}}</td>
                            <td>{{state.timeInStateHour}}</td>
                        </tr>

                    </tbody>
                </table>
            </div>
        </div>

Может кто-нибудь, пожалуйста, пролить свет на то, что я делаю неправильно здесь?


person phattyD    schedule 23.03.2016    source источник
comment
Я знаю datatables, но не знаю angular. Вы пытаетесь инициализировать объект Datatable с параметрами одного и того же элемента таблицы более одного раза. Это не разрешено. Я бы посмотрел на код инициализации и выяснил, как он вызывается более одного раза, и изменил бы это.   -  person Eric Guan    schedule 24.03.2016
comment
Хорошие мысли, это, безусловно, было состоянием гонки, так как две функции просмотра выполняют вызовы при первоначальном отображении страницы. Вы также можете щелкнуть кнопку изменения часа достаточно быстро, чтобы перегрузить рендеринг данных и заставить это произойти таким же образом. В итоге я использовал небольшой хак, чтобы обойти это. Участвует с использованием трех переменных, чтобы определить, обрабатывались ли таблицы данных, были ли инициализированы таблицы данных, а также для первоначального запуска отчета при загрузке страницы. Спасибо!   -  person phattyD    schedule 24.03.2016


Ответы (1)


Ошибка возникла из-за того, что вы пытались повторно инициализировать существующую базу данных. Вам нужно включить .withOption("destroy", true), чтобы:

$scope.dtOptions = DTOptionsBuilder.newOptions()

Это решит проблему.

person Stanley Okpala Nwosa    schedule 05.11.2017