fix: specify 'static' for ViewChild and ContentChild queries

demo/src/app/components/typeahead/demos/focus/typeahead-focus.ts

@@ -20,7 +20,7 @@ const states = ['Alabama', 'Alaska', 'American Samoa', 'Arizona', 'Arkansas', 'C
 export class NgbdTypeaheadFocus {
   model: any;
 
-  @ViewChild('instance') instance: NgbTypeahead;
+  @ViewChild('instance', {static: true}) instance: NgbTypeahead;
   focus$ = new Subject<string>();
   click$ = new Subject<string>();
 

demo/src/app/shared/code/code.component.ts

@@ -12,7 +12,7 @@ import {CodeHighlightService} from './code-highlight.service';
 })
 export class NgbdCodeComponent implements AfterViewInit {
 
-  @ViewChild('code') codeEl: ElementRef<HTMLElement>;
+  @ViewChild('code', {static: true}) codeEl: ElementRef<HTMLElement>;
 
   @Input() snippet: ISnippet;
 

e2e-app/src/app/typeahead/focus/typeahead-focus.component.ts

@@ -69,7 +69,7 @@ const states = [
 export class TypeaheadFocusComponent {
   model: any;
 
-  @ViewChild('instance') instance: NgbTypeahead;
+  @ViewChild('instance', {static: true}) instance: NgbTypeahead;
   focus$ = new Subject<string>();
   click$ = new Subject<string>();
 

e2e-app/src/app/typeahead/validation/typeahead-validation.component.ts

@@ -71,7 +71,7 @@ export class TypeaheadValidationComponent {
   model: any;
   public field = new FormControl(null, {updateOn: 'blur'});
 
-  @ViewChild('instance') instance: NgbTypeahead;
+  @ViewChild('instance', {static: true}) instance: NgbTypeahead;
   focus$ = new Subject<string>();
   click$ = new Subject<string>();
 

src/datepicker/datepicker.ts

@@ -123,7 +123,7 @@ export class NgbDatepicker implements OnDestroy,
     OnChanges, OnInit, AfterViewInit, ControlValueAccessor {
   model: DatepickerViewModel;
 
-  @ViewChild('months') private _monthsEl: ElementRef<HTMLElement>;
+  @ViewChild('months', {static: true}) private _monthsEl: ElementRef<HTMLElement>;
   private _controlValue: NgbDate;
   private _destroyed$ = new Subject<void>();
 

src/dropdown/dropdown.ts

@@ -133,10 +133,10 @@ export class NgbDropdown implements OnInit, OnDestroy {
   private _zoneSubscription: Subscription;
   private _bodyContainer: HTMLElement;
 
-  @ContentChild(NgbDropdownMenu) private _menu: NgbDropdownMenu;
-  @ContentChild(NgbDropdownMenu, {read: ElementRef}) private _menuElement: ElementRef;
+  @ContentChild(NgbDropdownMenu, {static: true}) private _menu: NgbDropdownMenu;
+  @ContentChild(NgbDropdownMenu, {read: ElementRef, static: true}) private _menuElement: ElementRef;
 
-  @ContentChild(NgbDropdownAnchor) private _anchor: NgbDropdownAnchor;
+  @ContentChild(NgbDropdownAnchor, {static: true}) private _anchor: NgbDropdownAnchor;
 
   /**
    * Indicates whether the dropdown should be closed when clicking one of dropdown items or pressing ESC.

src/modal/modal.spec.ts

@@ -1060,12 +1060,12 @@ class TestComponent {
   name = 'World';
   openedModal: NgbModalRef;
   show = true;
-  @ViewChild('content') tplContent;
-  @ViewChild('destroyableContent') tplDestroyableContent;
-  @ViewChild('contentWithClose') tplContentWithClose;
-  @ViewChild('contentWithDismiss') tplContentWithDismiss;
-  @ViewChild('contentWithImplicitContext') tplContentWithImplicitContext;
-  @ViewChild('contentWithIf') tplContentWithIf;
+  @ViewChild('content', {static: true}) tplContent;
+  @ViewChild('destroyableContent', {static: true}) tplDestroyableContent;
+  @ViewChild('contentWithClose', {static: true}) tplContentWithClose;
+  @ViewChild('contentWithDismiss', {static: true}) tplContentWithDismiss;
+  @ViewChild('contentWithImplicitContext', {static: true}) tplContentWithImplicitContext;
+  @ViewChild('contentWithIf', {static: true}) tplContentWithIf;
 
   constructor(public modalService: NgbModal) {}
 

src/pagination/pagination.ts

@@ -179,12 +179,12 @@ export class NgbPagination implements OnChanges {
   pageCount = 0;
   pages: number[] = [];
 
-  @ContentChild(NgbPaginationEllipsis) tplEllipsis: NgbPaginationEllipsis;
-  @ContentChild(NgbPaginationFirst) tplFirst: NgbPaginationFirst;
-  @ContentChild(NgbPaginationLast) tplLast: NgbPaginationLast;
-  @ContentChild(NgbPaginationNext) tplNext: NgbPaginationNext;
-  @ContentChild(NgbPaginationNumber) tplNumber: NgbPaginationNumber;
-  @ContentChild(NgbPaginationPrevious) tplPrevious: NgbPaginationPrevious;
+  @ContentChild(NgbPaginationEllipsis, {static: false}) tplEllipsis: NgbPaginationEllipsis;
+  @ContentChild(NgbPaginationFirst, {static: false}) tplFirst: NgbPaginationFirst;
+  @ContentChild(NgbPaginationLast, {static: false}) tplLast: NgbPaginationLast;
+  @ContentChild(NgbPaginationNext, {static: false}) tplNext: NgbPaginationNext;
+  @ContentChild(NgbPaginationNumber, {static: false}) tplNumber: NgbPaginationNumber;
+  @ContentChild(NgbPaginationPrevious, {static: false}) tplPrevious: NgbPaginationPrevious;
 
   /**
    * If `true`, pagination links will be disabled.

src/popover/popover.spec.ts

@@ -730,7 +730,7 @@ export class TestComponent {
   title: string;
   placement: string;
 
-  @ViewChild(NgbPopover) popover: NgbPopover;
+  @ViewChild(NgbPopover, {static: true}) popover: NgbPopover;
 
   constructor(private _vcRef: ViewContainerRef) {}
 
@@ -756,7 +756,7 @@ export class DestroyableCmpt implements OnDestroy {
 
 @Component({selector: 'test-hooks', template: `<div ngbPopover="popover"></div>`})
 export class TestHooksComponent implements AfterViewInit {
-  @ViewChild(NgbPopover) popover;
+  @ViewChild(NgbPopover, {static: true}) popover;
 
   ngAfterViewInit() { this.popover.open(); }
 }

src/rating/rating.ts

@@ -102,7 +102,7 @@ export class NgbRating implements ControlValueAccessor,
    * Alternatively put an `<ng-template>` as the only child of your `<ngb-rating>` element
    */
   @Input() starTemplate: TemplateRef<StarTemplateContext>;
-  @ContentChild(TemplateRef) starTemplateFromContent: TemplateRef<StarTemplateContext>;
+  @ContentChild(TemplateRef, {static: false}) starTemplateFromContent: TemplateRef<StarTemplateContext>;
 
   /**
    * An event emitted when the user is hovering over a given rating.

src/tooltip/tooltip.spec.ts

@@ -640,7 +640,7 @@ export class TestComponent {
   name = 'World';
   show = true;
 
-  @ViewChild(NgbTooltip) tooltip: NgbTooltip;
+  @ViewChild(NgbTooltip, {static: true}) tooltip: NgbTooltip;
 
   shown() {}
   hidden() {}
@@ -659,7 +659,7 @@ export class TestOnPushComponent {
 
 @Component({selector: 'test-hooks', template: `<div ngbTooltip="tooltip"></div>`})
 export class TestHooksComponent implements AfterViewInit {
-  @ViewChild(NgbTooltip) tooltip;
+  @ViewChild(NgbTooltip, {static: true}) tooltip;
 
   ngAfterViewInit() { this.tooltip.open(); }
 }

src/typeahead/typeahead-window.spec.ts

@@ -210,7 +210,7 @@ class TestComponent {
   term = 'ba';
   selected: string;
 
-  @ViewChild(NgbTypeaheadWindow) popup: NgbTypeaheadWindow;
+  @ViewChild(NgbTypeaheadWindow, {static: true}) popup: NgbTypeaheadWindow;
 
   formatterFn = (result) => { return result.toUpperCase(); };
 }

src/typeahead/typeahead.spec.ts

@@ -935,7 +935,7 @@ class TestComponent {
 
   findOutput$: Observable<any[]>;
 
-  @ViewChild(NgbTypeahead) typeahead: NgbTypeahead;
+  @ViewChild(NgbTypeahead, {static: true}) typeahead: NgbTypeahead;
   focus$ = new Subject<string>();
   click$ = new Subject<string>();