[Solved] What is wrong with this standalone component code?@Component({ selector: 'app-error', standalone: true, template: `Error component` }) export class ErrorComponent {}@Component({ selector:... | Angular

Angular - Standalone Components

What is wrong with this standalone component code?

@Component({ selector: 'app-error', standalone: true, template: `Error component
` }) export class ErrorComponent {}
@Component({ selector: 'app-root', standalone: true, template: ``, imports: [ErrorComponent] }) export class AppComponent {}

AStandalone components cannot have templates.

BAppComponent does not import ErrorComponent in its imports array.

CThe selector 'app-error' is invalid for standalone components.

DErrorComponent should not be standalone if used inside another component.

Step-by-Step Solution

Solution:

Step 1: Check component imports for nested usage
AppComponent uses <app-error> but does not import ErrorComponent in its imports array.
Step 2: Understand standalone component import rules
Standalone components must import other standalone components they use in templates.
Final Answer:
AppComponent does not import ErrorComponent in its imports array. -> Option B
Quick Check:
Missing import of nested standalone component causes error [OK]

Quick Trick: Always import standalone components you use inside templates [OK]

Common Mistakes:

Thinking standalone components don't need imports
Believing selectors are restricted for standalone
Assuming standalone components can't have templates

Master "Standalone Components" in Angular

9 interactive learning modes - each teaches the same concept differently

Learn Why Deep Visual Try Challenge Project Recall Perf

More Angular Quizzes

What is wrong with this standalone component code?

Step 1: Check component imports for nested usage

Step 2: Understand standalone component import rules

Final Answer:

Quick Check:

Want More Practice?