Elgato_dark/angular
1
0
Fork 0
mirror of https://github.com/angular/angular synced 2026-05-24 09:28:37 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

refactor(docs-infra): use interpolation instead of innerHTML for better perf (#58913)

Browse source 
Using innerHTML will cause the browser to parse the HTML and then create a DOM tree instead of just using normal interpolation.

PR Close #58913
This commit is contained in:
Enea Jahollari 2024-11-26 20:51:00 +01:00 committed by Pawel Kozlowski
parent 4852e57d9a
commit 2e4e485655
4 changed files with 9 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
adev/shared-docs/components/navigation-list/navigation-list.component.html
View file

@ -29,7 +29,7 @@
routerLinkActive="docs-faceted-list-item-active"
(click)="emitClickOnLink()"
>
<span [innerHtml]="item.label"></span>
<span>{{item.label}}</span>
@if (item.children && !item.isExpanded) {
<docs-icon>chevron_right</docs-icon>
}
@ -39,7 +39,7 @@
<!-- Nav Section Header -->
@if (item.level !== collapsableLevel() && item.level !== expandableLevel()) {
<div class="docs-secondary-nav-header">
<span [innerHtml]="item.label"></span>
<span>{{item.label}}</span>
</div>
}
@ -50,7 +50,7 @@
<button
type="button"
(click)="toggle(item)"
attr.aria-label="{{ item.isExpanded ? 'Collapse' : 'Expand' }} {{ item.label }}"
[attr.aria-label]="(item.isExpanded ? 'Collapse' : 'Expand') + ' ' + item.label"
[attr.aria-expanded]="item.isExpanded"
class="docs-secondary-nav-button"
[class.docs-faceted-list-item-active]="item | isActiveNavigationItem: activeItem()"

4
adev/shared-docs/components/navigation-list/navigation-list.component.ts
View file

@ -10,14 +10,14 @@ import {ChangeDetectionStrategy, Component, inject, input, output} from '@angula
import {NavigationItem} from '../../interfaces/index';
import {NavigationState} from '../../services/index';
import {RouterLink, RouterLinkActive} from '@angular/router';
import {CommonModule} from '@angular/common';
import {IconComponent} from '../icon/icon.component';
import {IsActiveNavigationItem} from '../../pipes/is-active-navigation-item.pipe';
import {NgTemplateOutlet} from '@angular/common';
@Component({
selector: 'docs-navigation-list',
standalone: true,
imports: [CommonModule, RouterLink, RouterLinkActive, IconComponent, IsActiveNavigationItem],
imports: [RouterLink, RouterLinkActive, IconComponent, IsActiveNavigationItem, NgTemplateOutlet],
templateUrl: './navigation-list.component.html',
styleUrls: ['./navigation-list.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush,

6
adev/src/app/features/references/api-items-section/api-items-section.component.html
View file

@ -1,14 +1,14 @@
<header class="adev-api-items-section-header">
<h3 [id]="group().id">
<!-- we use innerHtml because the title can be an html string-->
<a
routerLink="/api"
[fragment]="group().id"
queryParamsHandling="preserve"
class="adev-api-anchor"
tabindex="-1"
[innerHtml]="group().title"
></a>
>
{{group().title}}
</a>
</h3>
</header>

2
packages/core/global/BUILD.bazel
View file

@ -16,6 +16,6 @@ generate_api_docs(
"//packages:common_files_and_deps_for_docs",
],
entry_point = ":index.ts",
module_label = "<code>window.ng</code> globals",
module_label = "window.ng globals",
module_name = "@angular/core/globals",
)