Как сделать так, чтобы в Angular 6 работал столбец сведений о данных? - PullRequest
Новая
       23

Как сделать так, чтобы в Angular 6 работал столбец сведений о данных?

0 голосов
/ 23 октября 2018

Я использовал следующий учебник https://l -lin.github.io / angular-datatables / # / Getting-Start и все работает нормально, кроме столбца сведений, который не инициализируется, я попыталсяGoogle, но ничего особенного не появляется, и я довольно новичок в Angular, поэтому я не знаю, что делать. 

    "paging":false,
    "searching": false,
    "ordering": false,
    "info": false,
    "responsive": {
        "details": {
            "type": 'column',
            "target": 4
        }
    },
    "columnDefs": [
        {
            "width": 100, targets: [0, 1, 2, 3]
        },
        {
            "width": 10, targets: [4]
        },
        {
            "className": 'control',
            "orderable": false,
            "targets":  4
        },
        {
            "responsivePriority": 1, "targets": 3
        },
        {
            "responsivePriority": 2, "targets": 0
        }
    ],

Это мой HTML-код, который я пытался перевести на Angular, некоторые функцииЯ удалил, потому что они не могут быть найдены ID dtOptions, но я оставил отзывчивым и columnDefs, и он не дает никаких ошибок.Я знаю, что, должно быть, я делаю что-то не так, но что именно? 

 ngOnInit() {
        this.getForms();   
        this.dtOptions = {  
        scrollCollapse: true,
        paging: false,
        searching: false,
        ordering: false,
        info: false,
        responsive: {
            details: {
                type: 'column' ,
                target: 4
            }
        }
    };

Это мой угловой код, я правильно разместил все операции импорта и зависимости. 

<table datatable [dtOptions]="dtOptions" id="ankete_site_table" class="display" width="100%">
            <thead>
            <tr>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td class="control"></td>
            </tr>
            </thead>
            <tbody>
            <tr *ngFor="let f of forms; let i = index">
                <td><label class="ankete_checkbox">{{f.formName}}<input (change)="toggleVisibility($event, i)" class="Check" type="checkbox" name="Check" id="Check"><span class="checkmark"><span class="checkmark_box"></span></span></label></td>
                <td><span class="tekst-anketa">{{f.formDesc}}</span></td>
                <td class="ankete_broj"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 14.032 13.447"><defs><style></style></defs><path class="a" d="M22.707,13.447H8.675v-.695c0-1.412.117-2.23,1.859-2.611C12.5,9.7,14.44,9.312,13.5,7.665,10.745,2.768,12.721,0,15.691,0c2.912,0,4.946,2.667,2.187,7.665-.912,1.636.971,2.028,2.982,2.477C22.59,10.522,22.707,13.2,22.707,13.447Z" transform="translate(-8.675)"/></svg>
                    <span>36</span></td>
                <td class="ankete_ispuni"><a routerLink="formEditor/{{f.formId}}"><span>izmjeni</span><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 8.121 13.414"><defs><style></style></defs><path class="a" d="M165,180l6,6-6,6" transform="translate(-164.293 -179.293)"/></svg></a></td>
                <td class="control" style="width: 5%"></td>
            </tr>
            </tbody>
        </table>

И этоHTML таблица.И мне пришлось взять этот угловой код от другого человека, поэтому я не знаю всего, что можно оценить.

...