import {Component} from '@angular/core';
import {CommentsComponent} from './comments.component';
@Component({
selector: 'app-root',
template: `
<div>
<h1>How I feel about Angular</h1>
<article>
<p>
Angular is my favorite framework, and this is why. Angular has the coolest deferrable view
feature that makes defer loading content the easiest and
</p>
</article>
@defer (on viewport) {
<comments />
} @placeholder {
<p>Future comments</p>
} @loading (minimum 5s) {
<p>Loading comments...</p>
}
</div>
`,
standalone: true,
imports: [CommentsComponent],
})
export class AppComponent {}
import {Component} from '@angular/core';
@Component({
selector: 'comments',
template: `
<ul>
<li>Building for the web is fantastic!</li>
<li>The new template syntax is great</li>
<li>I agree with the other comments!</li>
</ul>
`,
standalone: true,
})
export class CommentsComponent {}
Soweit ist der Code verständlich, aber dieses @placeholder {
<p>Future comments</p>
}
Wird bei mir nicht angezeigt, wenn ich den Code ausführe ... Warum???
https://angular.dev/tutorials/learn-angular/10-deferrable-views
