diff --git a/projects/ng-devtools/src/lib/devtools-tabs/devtools-tabs.component.css b/projects/ng-devtools/src/lib/devtools-tabs/devtools-tabs.component.css index 027f1e0cfd1..e2571fd898d 100644 --- a/projects/ng-devtools/src/lib/devtools-tabs/devtools-tabs.component.css +++ b/projects/ng-devtools/src/lib/devtools-tabs/devtools-tabs.component.css @@ -39,6 +39,15 @@ fill: #2a76e4; } +#app-angular-version { + position: absolute; + top: 20px; + right: 10px; + font-size: 11px; + font-weight: bold; + color: #5128a5; +} + /deep/ .mat-tab-body-wrapper { height: calc(100% - 49px); /* 100% - header */ } diff --git a/projects/ng-devtools/src/lib/devtools-tabs/devtools-tabs.component.html b/projects/ng-devtools/src/lib/devtools-tabs/devtools-tabs.component.html index b32f4ac1ddd..2033a2f2935 100644 --- a/projects/ng-devtools/src/lib/devtools-tabs/devtools-tabs.component.html +++ b/projects/ng-devtools/src/lib/devtools-tabs/devtools-tabs.component.html @@ -32,3 +32,7 @@ + +
+ Angular version: {{angularVersion}} +
diff --git a/projects/ng-devtools/src/lib/devtools-tabs/devtools-tabs.component.ts b/projects/ng-devtools/src/lib/devtools-tabs/devtools-tabs.component.ts index fafcd5b6df0..49d88fea5b7 100644 --- a/projects/ng-devtools/src/lib/devtools-tabs/devtools-tabs.component.ts +++ b/projects/ng-devtools/src/lib/devtools-tabs/devtools-tabs.component.ts @@ -10,6 +10,7 @@ import { ComponentExplorerComponent } from './component-explorer/component-explo }) export class DevToolsTabsComponent { @Input() messageBus: MessageBus; + @Input() angularVersion: string | undefined = undefined; @ViewChild(MatTabGroup) tabGroup: MatTabGroup; @ViewChild(ComponentExplorerComponent) componentExplorer: ComponentExplorerComponent; diff --git a/projects/ng-devtools/src/lib/devtools-tabs/devtools-tabs.module.ts b/projects/ng-devtools/src/lib/devtools-tabs/devtools-tabs.module.ts index f53616325c3..98041f1f8d6 100644 --- a/projects/ng-devtools/src/lib/devtools-tabs/devtools-tabs.module.ts +++ b/projects/ng-devtools/src/lib/devtools-tabs/devtools-tabs.module.ts @@ -1,4 +1,5 @@ import { NgModule } from '@angular/core'; +import { CommonModule } from '@angular/common'; import { DevToolsTabsComponent } from './devtools-tabs.component'; @@ -8,7 +9,7 @@ import { ProfilerModule } from './component-explorer/profiler/profiler.module'; @NgModule({ declarations: [DevToolsTabsComponent], - imports: [MatTabsModule, ComponentExplorerModule, ProfilerModule], + imports: [MatTabsModule, ComponentExplorerModule, ProfilerModule, CommonModule], exports: [DevToolsTabsComponent] }) export class DevToolsTabModule {} diff --git a/projects/ng-devtools/src/lib/devtools.component.html b/projects/ng-devtools/src/lib/devtools.component.html index c582cbd1595..a0c1d3d5a99 100644 --- a/projects/ng-devtools/src/lib/devtools.component.html +++ b/projects/ng-devtools/src/lib/devtools.component.html @@ -1,6 +1,6 @@
- +
diff --git a/projects/ng-devtools/src/lib/devtools.component.ts b/projects/ng-devtools/src/lib/devtools.component.ts index ea50becf654..95abb23822f 100644 --- a/projects/ng-devtools/src/lib/devtools.component.ts +++ b/projects/ng-devtools/src/lib/devtools.component.ts @@ -9,6 +9,7 @@ import { interval } from 'rxjs'; }) export class DevToolsComponent implements OnInit, OnDestroy { angularExists: boolean | null = null; + angularVersion: string | undefined = undefined; @Input() messageBus: MessageBus; private _interval$ = interval(500).subscribe(() => this.messageBus.emit('queryNgAvailability')); @@ -18,6 +19,7 @@ export class DevToolsComponent implements OnInit, OnDestroy { this.messageBus.once('ngAvailability', ({ version }) => { this.angularExists = !!version; + this.angularVersion = version; this._interval$.unsubscribe(); }); }