How to check whether for assistance of element based on element name in angular unit testing?

Question

I have a side navbar as follows,

      <kendo-sidenav *ngFor="let nav of navOptions" [title]="nav.title">
      <kendo-sidenav>

My ts,

       "navOptions" = [{'title':'profile'},{'title':'friends'}];

My spec,

     it('should render title in a h1 tag', async(() => {
        const fixture = TestBed.createComponent(AppComponent);
        fixture.detectChanges();
        const compiled = fixture.debugElement.nativeElement;
       expect(compiled.querySelector('kendo-sidenav')).toBeTruthy()
      }));

But here I want to check 2 conditions,

1) Check side navbar is displayed if navOptions is not empty

2_ Check side navbar is not displayed if navOptions is empty.

I am new to unit testing,can anyone please suggest me help.Thanks.