[Solved] This component code throws an error:@Component({ selector: 'app-error', template:... }', encapsulation: ViewEncapsulation.Emulated }) export class ErrorComponent {}What is the error? | Angular

Angular - Components

This component code throws an error:

@Component({
  selector: 'app-error',
  template: `Error`,
  styles: '.error { color: red; }',
  encapsulation: ViewEncapsulation.Emulated
})
export class ErrorComponent {}

What is the error?

AStyles should be an array, not a string

BThe selector is invalid

CTemplate syntax is incorrect

DViewEncapsulation.Emulated is deprecated

Step-by-Step Solution

Solution:

Step 1: Check styles property type
Styles must be an array of strings, not a single string.
Step 2: Validate other properties
Selector and template are valid; Emulated is not deprecated.
Final Answer:
Styles should be an array, not a string -> Option A
Quick Check:
Styles property requires array syntax [OK]

Quick Trick: Always wrap styles in an array, even if one string [OK]

Common Mistakes:

Passing styles as string
Misnaming selector
Incorrect template syntax

Master "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

This component code throws an error:

Step 1: Check styles property type

Step 2: Validate other properties

Final Answer:

Quick Check:

Want More Practice?