{"action":"created","issue":{"url":"https://api.github.com/repos/l-lin/angular-datatables/issues/1109","repository_url":"https://api.github.com/repos/l-lin/angular-datatables","labels_url":"https://api.github.com/repos/l-lin/angular-datatables/issues/1109/labels{/name}","comments_url":"https://api.github.com/repos/l-lin/angular-datatables/issues/1109/comments","events_url":"https://api.github.com/repos/l-lin/angular-datatables/issues/1109/events","html_url":"https://github.com/l-lin/angular-datatables/issues/1109","id":264201554,"node_id":"MDU6SXNzdWUyNjQyMDE1NTQ=","number":1109,"title":"Datatable not rendered when switch back from another component","user":{"login":"XtheWiz","id":8407354,"node_id":"MDQ6VXNlcjg0MDczNTQ=","avatar_url":"https://avatars3.githubusercontent.com/u/8407354?v=4","gravatar_id":"","url":"https://api.github.com/users/XtheWiz","html_url":"https://github.com/XtheWiz","followers_url":"https://api.github.com/users/XtheWiz/followers","following_url":"https://api.github.com/users/XtheWiz/following{/other_user}","gists_url":"https://api.github.com/users/XtheWiz/gists{/gist_id}","starred_url":"https://api.github.com/users/XtheWiz/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/XtheWiz/subscriptions","organizations_url":"https://api.github.com/users/XtheWiz/orgs","repos_url":"https://api.github.com/users/XtheWiz/repos","events_url":"https://api.github.com/users/XtheWiz/events{/privacy}","received_events_url":"https://api.github.com/users/XtheWiz/received_events","type":"User","site_admin":false},"labels":[{"id":490040335,"node_id":"MDU6TGFiZWw0OTAwNDAzMzU=","url":"https://api.github.com/repos/l-lin/angular-datatables/labels/Angular","name":"Angular","color":"b60205","default":false}],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":8,"created_at":"2017-10-10T12:01:33Z","updated_at":"2018-06-06T13:19:07Z","closed_at":null,"author_association":"NONE","body":"\r\n\r\n## What versions you are using?\r\n\r\n- node version: 6.11.3\r\n- npm version: 3.10.10\r\n- angular version: 4.2.4\r\n- jquery version: 3.2.1\r\n- datatables version: 1.10.16\r\n- angular-datatables version: 4.2.0\r\n- angular-cli version: 1.4.1\r\n\r\n## What's the problem?\r\nHi, I am using Angular4 with angular-datatable and face the problem. That is when I am at page 'A' (PageACompanent) the data table is shown correctly. Then I click the routerLink to navigate to page 'B' (PageBComponent), and then click the routerLink to navigate back to page 'A' again, but this time the data table is not draw anymore.\r\n\r\n## Can you share your code? \r\ntemplate.html\r\n```html\r\n<table datatable \r\n  [dtOptions]=\"dtOptions\" \r\n  [dtTrigger]=\"dtTrigger\" \r\n  class=\"row-border hover\">\r\n  <thead>\r\n    <tr>\r\n      <th style=\"width: 100px; text-align:center;\">No.</th>\r\n      <th>Company Name</th>\r\n      <th style=\"text-align:center; width: 200px;\">Action</th>\r\n    </tr>\r\n  </thead>\r\n  <tbody>\r\n    <tr *ngFor=\"let company of companyList; let i = index\">\r\n      <th scope=\"row\" style=\" text-align:center;\">{{ i + 1 }}</th>\r\n      <td>{{ company.companyName }}</td>\r\n      <td style=\"text-align: center\">\r\n        <a role=\"button\" class=\"btn btn-info btn-sm\" routerLink=\"/companies/edit/{{company.$key}}\">\r\n          <i class=\"fa fa-list align-middle\" aria-hidden=\"true\"></i>\r\n        </a>\r\n        <a role=\"button\" class=\"btn btn-danger btn-sm ml-3\" routerLink=\"/staffs\">\r\n          <i class=\"fa fa-trash-o align-middle\" aria-hidden=\"true\"></i>\r\n        </a>\r\n      </td>\r\n    </tr>\r\n  </tbody>\r\n</table>\r\n```\r\n\r\nmyfile.ts\r\n```typescript\r\nngOnInit() {\r\n    this.companyObserver = this.db.list('/companies-info');\r\n    this.companyObserver.subscribe(companies => {\r\n      this.companyList = companies;\r\n      this.dtTrigger.next();\r\n    });\r\n  }\r\n\r\n  public ngOnDestroy(): void {\r\n    this.dtElement.dtInstance.then( (dtInstance: DataTables.Api) => {\r\n      console.log('destroy table');\r\n      dtInstance.destroy();\r\n    });\r\n  }\r\n```"},"comment":{"url":"https://api.github.com/repos/l-lin/angular-datatables/issues/comments/395065344","html_url":"https://github.com/l-lin/angular-datatables/issues/1109#issuecomment-395065344","issue_url":"https://api.github.com/repos/l-lin/angular-datatables/issues/1109","id":395065344,"node_id":"MDEyOklzc3VlQ29tbWVudDM5NTA2NTM0NA==","user":{"login":"kinguy1","id":24986095,"node_id":"MDQ6VXNlcjI0OTg2MDk1","avatar_url":"https://avatars0.githubusercontent.com/u/24986095?v=4","gravatar_id":"","url":"https://api.github.com/users/kinguy1","html_url":"https://github.com/kinguy1","followers_url":"https://api.github.com/users/kinguy1/followers","following_url":"https://api.github.com/users/kinguy1/following{/other_user}","gists_url":"https://api.github.com/users/kinguy1/gists{/gist_id}","starred_url":"https://api.github.com/users/kinguy1/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/kinguy1/subscriptions","organizations_url":"https://api.github.com/users/kinguy1/orgs","repos_url":"https://api.github.com/users/kinguy1/repos","events_url":"https://api.github.com/users/kinguy1/events{/privacy}","received_events_url":"https://api.github.com/users/kinguy1/received_events","type":"User","site_admin":false},"created_at":"2018-06-06T13:19:07Z","updated_at":"2018-06-06T13:19:07Z","author_association":"NONE","body":"try this: \r\n\r\n`if (this.dtTrigger.observers) {          this.dtTrigger.next();}`\r\n\r\nfor me it work"}}
{"actor":{"display_login":"kinguy1"}}