bsInstanceof is a switch-like structural directive that branches based on the runtime class of a value. Each *bsInstanceofCase matches an instanceof check and exposes the narrowed instance to its template; *bsInstanceofDefault renders when no case matches.
instanceof directly in templates. However, it's not sure if the feature will land in version 21.2 - it may be introduced in version 22, which is usually planned to release new experimental features. (commit)
<ng-container [bsInstanceof]="item">
<ng-container *bsInstanceofCase="A; let a">{{ a.a }}</ng-container>
<ng-container *bsInstanceofCase="B; let b">{{ b.b }}</ng-container>
<ng-container *bsInstanceofDefault>No match</ng-container>
</ng-container>
import { Component } from '@angular/core';
import {
BsInstanceOfDirective,
BsInstanceofCaseDirective,
BsInstanceOfDefaultDirective,
} from '@mintplayer/ng-bootstrap/instance-of';
class Base { text = 'text'; }
class A extends Base { a = 'a'; }
class B extends Base { b = 'b'; }
@Component({
selector: 'my-instance-of-demo',
templateUrl: './my-instance-of-demo.component.html',
imports: [BsInstanceOfDirective, BsInstanceofCaseDirective, BsInstanceOfDefaultDirective],
})
export class MyInstanceOfDemoComponent {
protected item: Base = new A();
protected readonly A = A;
protected readonly B = B;
}