在这段代码中，我给出了dayavailablescroll引用，但是在ngafterviewinit中它显示为未定义

<div class="shifts-rightTable " style="background-color: yellow" [ngClass]="{'tab-active':availData?.length}" >
                <ng-scrollbar #dayavailablescroll  [autoHeightDisabled]='false' track='horizontal'>

                <table class="table" >
                    <tbody>
                        <tr *ngFor="let secondValue of availData;let s = index;">
                            <td>
                                <div class="shift-scheduleWrapper dayLeaveIcons" *ngFor="let thirdValue of secondValue.user_roster_data;let m = index;">
                                    <div class="shift-scheduleList" [ngClass]="{'removeLeftspace':(thirdValue.day_status != 'Exchanged' && thirdValue.day_status != 'Scheduled' && thirdValue.day_status != 'Full day leave' && thirdValue.day_status != 'Exchange-Requested')}" [ngStyle]="{left:thirdValue.starTime + 'px',width: thirdValue.totalWidth + 'px'}" *ngIf="thirdValue.schedule_id  && thirdValue.day_status != 'Holiday' && thirdValue.day_status != 'Weekend' && thirdValue.leave_status != 1 && thirdValue.day_status != 'Full day onduty'" (click)="$event.stopPropagation();setShow(s,m);closeOthers(s,m);selectedId = thirdValue.schedule_id;saveValue({id:availData[s].code,firstname:availData[s].first_name,lastname:availData[s].last_name,timeStart:tableData[s].user_roster_data[m].start_time,timeEnd:availData[s].user_roster_data[m].end_time,name:thirdValue.shift_name,date:cDateValue,schId:thirdValue.schedule_id,photo:availData[s].photo,longDate:this.currentWeek[m],username:availData[s].user_id,schedule:thirdValue.exchange_id});"><div class="shiftIcons" [ngClass]="getCurrent(thirdValue.cell_style_class)" *ngIf="(thirdValue.day_status != 'Scheduled'&& thirdValue.day_status != 'Full day leave' && thirdValue.day_status != 'Full day onduty' && thirdValue.day_status != 'Exchanged' && thirdValue.day_status != 'Exchange-Requested')"><span></span></div>{{thirdValue.start_time}} - {{thirdValue.end_time}}
                                    <hris-schedule-exchange *ngIf="thirdValue.active;" (action)="closeAll()" [ngClass]="{'left-active':m >= (secondValue.user_roster_data.length/2),'right-active':m < (secondValue.user_roster_data.length/2),'top-active': s < (availData.length / 2),'bottom-active':s >= (availData.length / 2)}" [id]="thirdValue.id" (exchangeAction)="enableExchange=true;" (editAction)="showEditForm = true;editStatus = true;dataInput = $event.data;disableAll = true;" [dataInput]="{id:availData[s].code,firstname:availData[s].first_name,lastname:availData[s].last_name,timeStart:availData[s].user_roster_data[m].start_time,timeEnd:availData[s].user_roster_data[m].end_time,name:thirdValue.shift_name,date:this.dayList[m],schId:thirdValue.schedule_id,photo:availData[s].photo,longDate:this.currentWeek[m],username:availData[s].user_id,schedule:thirdValue.exchange_id,sch_id:thirdValue}" [showExchange]="((availData[s].user_id == userData.user_id) && thirdValue.exShow)?true:false" [showEdit]="thirdValue.show"></hris-schedule-exchange>
                                    <div class="exchange-req-icon emp-request" (click)="$event.stopPropagation();saveValue({id:availData[s].code,firstname:availData[s].first_name,lastname:availData[s].last_name,timeStart:tableData[s].user_roster_data[m].start_time,timeEnd:availData[s].user_roster_data[m].end_time,name:thirdValue.shift_name,date:cDateValue,schId:thirdValue.schedule_id,photo:availData[s].photo,longDate:this.currentWeek[m],username:availData[s].user_id,schedule:thirdValue.exchange_id});exchangeView=true;" *ngIf="thirdValue.day_status == 'Exchange-Requested'"></div></div>
                                    <div class="shiftIcons" [ngClass]="getCurrent(thirdValue.cell_style_class)" *ngIf="(thirdValue.day_status != 'Scheduled'&& thirdValue.day_status != 'Full day leave' && thirdValue.day_status != 'Full day onduty' && thirdValue.day_status != 'Exchanged' && thirdValue.day_status != 'Exchange-Requested')" [ngStyle]="{left:thirdValue.starTime + 'px'}"><span></span></div>
                                    <div *ngIf="thirdValue.schedule_id && thirdValue.leave_status == 1 && thirdValue.day_status != 'Holiday' && thirdValue.day_status != 'Weekend' && thirdValue.day_status != 'Full day onduty'" [ngStyle]="{width: thirdValue.totalWidth + 'px',left:thirdValue.starTime + 'px'}" class="shift-scheduleList" [ngClass]="{'removeLeftspace':(thirdValue.day_status != 'Exchanged' && thirdValue.day_status != 'Scheduled' && thirdValue.day_status != 'Full day leave' && thirdValue.day_status != 'Exchange-Requested')}" (click)="thirdValue.active = !thirdValue.active;closeOthers(s,m);selectedId = thirdValue.schedule_id;">
                                        {{thirdValue.start_time}} - {{thirdValue.end_time}}
                                        <hris-schedule-exchange *ngIf="thirdValue.active;" (action)="closeAll()" [ngClass]="{'left-active':m >= (secondValue.user_roster_data.length/2),'right-active':m < (secondValue.user_roster_data.length/2),'top-active': s < (availData.length / 2),'bottom-active':s >= (availData.length / 2)}" [id]="thirdValue.id" (exchangeAction)="enableExchange=true;" (editAction)="showEditForm = true;editStatus = true;dataInput = $event.data;disableAll = true;" [dataInput]="{id:availData[s].code,firstname:availData[s].first_name,lastname:availData[s].last_name,timeStart:availData[s].user_roster_data[m].start_time,timeEnd:availData[s].user_roster_data[m].end_time,name:thirdValue.shift_name,date:cDateValue,schId:thirdValue.schedule_id,photo:availData[s].photo,longDate:onlyDate,username:availData[s].user_id,schedule:thirdValue.exchange_id,sch_id:thirdValue}" [showExchange]="((availData[s].user_id == userData.user_id) && thirdValue.exShow)?true:false" [showEdit]="thirdValue.show"></hris-schedule-exchange>
                                    </div>
                                </div>
                            </td>
                            
                        </tr>
                    </tbody>
                </table>
                </ng-scrollbar>
            </div>

typescript

ngAfterViewInit() {
    console.log( this.dayavailablescroll);}//undefined