Intermediate Angular test (Intermediate)

Sample questions

5 sample questions from the Intermediate Angular test, with the answers. Samples are taken out of the live test, so you will not meet these when you sit it.

1. Which method of form validation in Angular allows for dynamic and programmatic validation through the use of the Validators class?

   1. Reactive form validation
   2. Template-driven form validation
   3. Form array validation
   4. Form group validation

   Answer: A. Reactive form validation

   In Angular's reactive forms, validation is implemented using the Validators class and is applied directly to form controls. This allows for dynamic and programmatic validation, which is a key feature of reactive forms. Template-driven forms, on the other hand, use directives like ngModel and rely on HTML attributes for validation.

2. Which RxJS operator is best suited for combining multiple observables and emitting the latest values from each whenever any of them emits, rather than waiting for all of them to complete?

   1. switchMap
   2. forkJoin
   3. combineLatest
   4. mergeMap

   Answer: C. combineLatest

   combineLatest is used to combine multiple observables and emit the latest values from each whenever any of them emits. In contrast, forkJoin waits for all observables to complete and then emits their last values. Therefore, combineLatest is the correct choice when you want to react to the latest values from multiple observables as they emit, rather than waiting for all of them to complete.

3. Which of the following is the correct way to create a FormGroup in Angular's reactive forms approach?

   1. Use the FormGroup class directly to create a FormGroup without FormBuilder.
   2. Use the FormBuilder to create a FormGroup and add controls to it.
   3. Use the NgForm directive to create a FormGroup.
   4. Use the FormControl class directly to create a FormGroup.

   Answer: B. Use the FormBuilder to create a FormGroup and add controls to it.

   In Angular's reactive forms approach, the FormBuilder service is used to create a FormGroup and add form controls to it. This is the standard and recommended way to create reactive forms in Angular. The other options are either incorrect or not the standard method for creating a FormGroup.

4. Which of the following statements correctly describes the implementation of a route guard in Angular?

   1. A route guard must return a boolean, an Observable, or a Promise, and must not block navigation unless it returns false.
   2. A route guard can redirect users to another route by returning a Router object directly.
   3. Route guards are only used for authentication checks and cannot be used for other purposes.
   4. A route guard can block navigation by throwing an error directly in the canActivate method.

   Answer: A. A route guard must return a boolean, an Observable, or a Promise, and must not block navigation unless it returns false.

   Route guards are used to control navigation to a route. A common mistake is assuming that a route guard can directly block navigation by throwing an error. However, the correct approach is to return false, which prevents navigation. Returning an Observable or Promise allows asynchronous checks, but they must resolve to a boolean value to decide whether to allow or block navigation. Throwing errors is not the intended usage and can lead to unexpected behavior.

5. How can a parent component directly access a child component in Angular?

   1. The child component can be accessed using a template reference variable in the parent component.
   2. The parent component can be accessed using an @Output() property in the child component.
   3. The child component can be accessed using an @Input() property in the parent component.
   4. The component can be accessed using a ViewChild reference in the parent component.

   Answer: D. The component can be accessed using a ViewChild reference in the parent component.

   In Angular, when a parent component needs to access a child component directly, it can use the @ViewChild decorator to create a reference to the child component. This allows the parent component to call methods or access properties of the child component directly. The other options are either incorrect or do not describe the proper way to access a child component in Angular.