typeError : 정의되지 않은 'dtInstance'속성을 읽을 수 없습니다.

Question

Louis Lin이 angular2로 angle-datatables를 구현하려고합니다.

내가 Datata 인스턴스를 얻으려고 할 때 typeError : 정의되지 않은의 'dtInstance'속성을 읽을 수 없습니다.

나는 아래 here

에서 문서에서 단계를 말하는 겁니다이

import { Component, OnInit,AfterViewInit,ViewChild } from '@angular/core'; 
import { Http, Response, Headers, RequestOptions } from '@angular/http'; 
import { Observable } from 'rxjs/Observable'; 
import { Subject } from 'rxjs/Rx'; 
import { DataTableDirective } from 'angular-datatables'; 
import { EmployeeService } from '../services/employee.service'; 
import { Employee} from "app/services/employee"; 
@Component({ 
selector: 'app-employees', 
templateUrl: './employees.component.html', 
styleUrls: ['./employees.component.css'] 
}) 

export class EmployeesComponent implements OnInit { 
employees: Employee[]; 
private datatableElement: DataTableDirective; 
dtOptions: DataTables.Settings = {}; 
constructor(
private employeeservice:EmployeeService, 
private route: ActivatedRoute, 
private router: Router, 
) { 

} 
ngOnInit(): void { 
this.getEmployee(); 
this.dtOptions = { 
    paginationType: 'full_numbers', 
    displayLength: 5 
    }; 
} 
displayToConsole(datatableElement: DataTableDirective): void 
{ 
datatableElement.dtInstance.then((dtInstance: DataTables.Api) => 
console.log(dtInstance)); 
} 
getEmployee(){ 
this.employeeservice.getEmployees() 
.subscribe(
    employees =>{ 
     this.employees = employees; 
     console.log(this.employees); 
    (error:Response) => console.log(error) 
    }, 
)  
} 

deleteEmployee(employee){ 
if (confirm("Are you sure you want to delete Employee ?")) { 
console.log(employee.id); 
    var index = this.employees.indexOf(employee); 
    this.employees.splice(index, 1); 

    this.employeeservice.deleteEmployee(employee.id) 
    .subscribe(
     data =>{ 
     this.emp_data = employee; 
     }, 
     err => { 
     alert("Could not delete employee."); 
     // Revert the view back to its original state 
     this.employees.splice(index, 0, employee); 
     }, 
    () => this.router.navigate(['/employees']) 
    ); 
    } 
} 
} 

Answer 1

당신이 그것을 데이터를하기 전에, 당신이이 있는지 확인하기 위해 promise를 사용할 수 datatableElement을 사용하는 것 같은데 내 코드입니다 데이터. 공백 {this.dtOptions this.http.get = ('데이터/dtOptions.json') .toPromise() 그 때는 (대응 => response.json :