@ViewChild为空

Question

In my component I have the following:

@ViewChild('PaginatedTableComponent') userTable: PaginatedTableComponent;

Inside this component I have the following HTML:

<pag-paginated-table #userTable
       [(shouldUpdate)]="shouldUpdate"
       [route]="academyMembersRoute"
       [dataStructure]="academyMembersdataStructure"
       [adminActions]="adminActions"
       [include]="academyMembersInclude">
</pag-paginated-table>

However, the userTable variable is null .

Can anyone tell me what I might be missing? Or why this is happening?

Update

So this is really odd if i call the function in my ngOnInit it shows that the variable is correctly set.

However, if I wait and call if from the following :

addUserClose() {
    this.userTable.callRoute();
    this.shouldUpdate = !this.shouldUpdate;
}

it says that the variable is undefined.

Answer 1

Probably this is because you are accessing it before it is initiated. Try to access it in timeout with zero time out or access it in or after 'ngOnInit' function has been fired. Thanks

Answer 2

what you give inside the @ViewChild('your_Variable') to be used in html #your_Variable

Change you component.ts to

@ViewChild('PaginatedTableComponent') userTable: PaginatedTableComponent;

And change you component.html to

<pag-paginated-table #PaginatedTableComponent
       [(shouldUpdate)]="shouldUpdate"
       [route]="academyMembersRoute"
       [dataStructure]="academyMembersdataStructure"
       [adminActions]="adminActions"
       [include]="academyMembersInclude">
</pag-paginated-table>

Answer 3

您尝试过：

@ViewChild('userTable') userTable: PaginatedTableComponent; // NOT @ViewChild('PaginatedTableComponent')