Which CLI command should we run to compile and serve our project locally in development mode?
ng serve
ng build
ng development
ng deploy
What does Angular refer to?
The latest version of the framework (Angular 2+)
Version 3 of the framework
Version 16 of the framework
Version 1 of the framework
Which of the following file names does not follow the Angular style-guide conventions?
uppercase-pipe.ts
highlight-all.directive.ts
name.service.ts
app.component.ts
Which one of the following is not a valid Angular CLI command?
ng fix
ng build
ng add
ng test
Which one of these concepts does not exist in the Angular framework?
Standalone components
Structural directives
Redux reducers
NgModules
Which of the following statements is true?
Services link components to server-side HTML templates
Pipes are used to format data such as dates and numbers
Component libraries cannot be customized to our needs
Directives are a way to interact with server-side APIs
What's the main language of the Angular framework?
JSP
AppScript
JavaScript
TypeScript
When do we need to create or use Angular services?
To implement business logic
To filter data displayed in a component
To generate, serve, compile, test, and build Angular code
To interact with the browser
What is the difference between an interface and a class in TypeScript?
There is no difference between an interface and a class in TypeScript.
An interface is a contract that defines the properties and methods that an object must have. A class is a blueprint for creating objects.
A class is a contract that defines the properties and methods that an object must have. An interface is a blueprint for creating objects
None of these answers are correct.
According to the following declaration:
let users = ["a", "b", "c"];
What is the type of users?
Array
None of the above
string[]
char[]
What is the type of the variable `myVar` if it is declared as follows:
let myVar: string | number;
number
string
This syntax doesn't work
string or number
Which of the following code examples does not compile?
let a: number = 42;
const c: number = "21";
var a = 42;
let c = 'number';
ngIf shorthand syntax
ngIf expanded syntax:
ngIf with an "else" block:
ngIf form with "then" and "else" blocks:
ngIf with storing the value locally:
ngFor shorthand syntax
ngFor expanded syntax
ng-template
switch case default
@for with @empty
Contextual variable
$count
Contextual variable
$index
Contextual variable
$first
Contextual variable
$last
Contextual variable
$even
Contextual variable
$odd
All context variables usage example
Structural directives
Structural directive
select
Structural directive
select
shorthand
Binding key in
<p class="data-view" *select="let data from source">The data is: {{data}}</p>
One structural directive per element
creating the SelectDirective
ng generate directive select
Which @for block option is required?
count
track
trackBy
$index
Which of the following options is not a valid Angular selector?
app-header
ng-header
[header]:not(div)
.header
What is the decorator used to pass data to a component?
@Data()
@Input()
@Model()
@Prop()
Which of these HTML template examples would automatically render the latest value of data when data changes?
(click)="data"
([ngModel])=”data”
[value]="data"
{data}
Which of the following correctly sets a new value for a Signal called mySig?
mySig = 21
mySig() = 21
mySig.set(21)
mySig.setValue(21)
Which component decorator option turns a component into a standalone feature?
module: false
changeDetectionStrategy: Standalone
ngModule: false
standalone: true
What is the decorator used to pass data to a component?
@Prop()
@Property()
@Input()
@Data()
Is there anything wrong with the following template?
<button (click)="extendDateFor(selection)" disabled="selection.isEmpty()">
Extend date for selection
</button>
No, the code looks correct.
Yes, curly braces {{ }} are missing for the expression bindings.
Yes, the click listener syntax should be (onClick).
Yes, square brackets are missing around disabled. It should be [disabled] instead.
What is the difference between an interface and a class in TypeScript?
A class is a contract that defines the properties and methods that an object must have. An interface is a blueprint for creating objects
There is no difference between an interface and a class in TypeScript.
None of these answers are correct.
An interface is a contract that defines the properties and methods that an object must have. A class is a blueprint for creating objects.
According to the following declaration:
let users = ["a", "b", "c"];
What is the type of users?
string[]
None of the above
char[]
Array
What is the type of the variable myVar if it is declared as follows:
let myVar: string | number;
string
number
This syntax doesn't work
string or number
Which of the following code examples does not compile?
const c: number = "21";
var a = 42;
let c = 'number';
let a: number = 42;
Which of the following is not an Angular directive from @angular/common?
ngBind
ngIf
ngSwitch
ngClass
Which of these options is the correct syntax for pipe parameters?
{{ amount | currency : ‘USD’ }}
{{ amount | currency :: ‘$’ }}
{{ amount | currency | ‘USD’ }}
None of the above - all are incorrect
What is a directive?
A way to inject services and business logic
A component with no HTML template
A pipe with an HTML template
A component with no selector
Which one of these pipes does not exist in the Angular framework?
json
format
titlecase
currency
In Angular, which of the following decorators is used to register a class as a service?
@Inject
@Service
@Injectable
@NgService
Can the following class be injected into a component as-is?
import { Injectable } from "@angular/core";
import { HttpClient } from "@angular/common/http";
@Injectable()
export class CartService {
constructor(private http: HttpClient) {}
getCartContents() {
// Some code
}
}
No, it does not have the @Service decorator
Yes
No, that code does not compile
No, it has to be added to an array of providers first
According to the following code, how many instances of TokenService can we have in an Angular application?
(assuming there's no other dependency injection configuration anywhere else for that service)
@Injectable({
providedIn: "root",
})
export class TokenService {
// ... (rest of the class implementation)
}
It could be any number of instances
Zero or one
One
One per module
What is the name of the service used to make HTTP requests with Angular?
$resource
HttpClient
HttpService
Fetch
Which of the following properties is NOT a valid property of an Angular FormControl:
dirty
valid
async
untouched
What is the name of the Angular service used to create reactive forms?
FormFactory
FormBuilder
FormControl
FormService
Which of these statements is correct regarding template-driven forms?
They are configured only in HTML templates
They are configured with TypeScript code
They enable RxJs subscriptions to any value and state change in the form
They require simple functions for form validation
Which of the following CSS classes is NOT automatically managed by Angular forms?
ng-invalid
ng-dirty
ng-select
ng-touched
In Angular, what is the purpose of the tag?
It defines the root component of the application
It's a way to embed an iframe in an Angular application
It specifies navigation links for the user
It indicates where routed components will be rendered
Considering the following router config, which component will be rendered when a user navigates to /products/21?
RouterModule.forRoot([
{ path: "", component: ProductListComponent },
{ path: "products/:productId", component: ProductDetailsComponent },
]);
ProductDetailsComponent
None; there is no mapping for that route
ProductListComponent
A 404 page would show up
Which of the following is an existing guard function that can be used with the Angular router?
CanActivate
CanInit
CannotActivate
CanNavigate
What is the name of the Angular service used to manage routing?
RouterOutlet
ActivatedRoute
Router
RouterService
What is the recommended approach when using multiple Signals in a single component?
- A) Use global variables for signals
- B) Combine similar Signals into one
- C) Utilize composed signals for better readability
- D) Manage Signals in a service to share state
What type of value can a Signal hold in Angular?
- A) Only primitive values
- B) Only objects
- C) Any type of value (primitive, objects, arrays, etc.)
- D) String values only
What is a common pattern observed when using Signals in Angular?
- A) Mixing signals with reactive forms
- B) Using signals only for component state management
- C) Combining signals with observables
- D) Having signals for only simple values
What is the default behavior of a Signal in Angular with respect to change detection?
- A) Signals do not trigger change detection in Angular.
- B) Signals trigger change detection only on subscription.
- C) Signals automatically trigger change detection when their value is updated.
- D) Signals require manual triggers for change detection.
Which of the following correctly resets a writable signal to a new value?
- A) `signal.reset(newValue);`
- B) `signal.set(newValue);`
- C) `signal.update(newValue);`
- D) `signal.value = newValue;`
How can you react to changes in a Signal in Angular?
- A) By subscribing using `.subscribe()`
- B) By using `ngFor`
- C) By using `*ngIf`
- D) Automatically in the template with interpolation
Which lifecycle hook is most common for reading Signals?
- A) ngOnInit
- B) ngAfterViewInit
- C) ngOnDestroy
- D) ngOnChanges
How do you create a writable signal in Angular?
- A) `let signal = signal(writableValue);`
- B) `let signal = new Signal(writableValue);`
- C) `let signal = writableSignal(writableValue);`
- D) `let signal = createSignal(writableValue);`
Which of the following is a key advantage of using Signals in Angular?
- A) It allows hiding components.
- B) It provides built-in form validation.
- C) It simplifies managing state changes.
- D) It automatically generates HTTP service endpoints.
What are Angular Signals primarily used for?
- A) To manage Angular services
- B) To handle state and reactivity
- C) To perform HTTP requests
- D) To define routes
What is the primary function of an Angular Signal?
A: To directly manipulate the DOM outside of Angular's change detection.
B: To provide a wrapper around a value that notifies consumers when it changes, enabling fine-grained reactivity.
C: To replace RxJS Observables for all asynchronous operations.
D: To define the visual structure of a component using template syntax.
Which of the following CORRECTLY shows how to create and update a writable signal in an Angular component?
A: this.counter = signal(0); this.counter.setValue(1);
B: this.counter = new Signal(0); this.counter.update(1);
C: this.counter = signal(0); this.counter.set(1);
D: this.counter = createSignal(0); this.counter(1);
How does a `computed()` signal primarily differ from a writable `signal()`?
A: Computed signals can only hold primitive values, while writable signals can hold objects.
B: Computed signals update their value immediately when dependencies change, whereas writable signals update asynchronously.
C: Computed signals derive their value from other signals and are lazily evaluated and memoized, while writable signals are directly updated via `.set()` or `.update()`.
D: Writable signals automatically track dependencies, while computed signals require manual dependency registration.
In a real-world application, when would you use a computed signal INSTEAD OF directly calculating a value in the template?
A: When you need to display the current time that updates every second.
B: When you have a complex calculation based on signals that's used in multiple places in your template.
C: When you need to trigger an HTTP request whenever a signal changes.
D: When you need to update multiple signals simultaneously.
In an Angular component using `ChangeDetectionStrategy.OnPush`, what occurs when a signal read within its template is updated?
A: The component and all its ancestors are automatically marked for check.
B: Only the specific DOM element bound to the signal is updated, bypassing component change detection.
C: The component is automatically marked for check, ensuring it re-renders to reflect the signal's new value.
D: An error is thrown because signals cannot be used directly in OnPush component templates.
Which scenario is the MOST appropriate use case for an `effect()` in Angular Signals?
A: Calculating a derived value based on one or more signals to display in the template.
B: Creating a new signal whose value depends on another signal.
C: Logging signal value changes to the console or synchronizing signal state with `localStorage`.
D: Binding a signal's value to an input property of a child component.
How do Signals compare to RxJS Observables in Angular applications?
A: Signals completely replace RxJS and should be used for all reactive programming needs.
B: Signals are for synchronous state management while RxJS excels at handling asynchronous streams, transformations, and complex event patterns.
C: Signals are exclusively for components, while RxJS is only for services.
D: Signals work with templates but RxJS doesn't work with Angular's binding system.
What happens when you modify a deeply nested property within an object held by a signal without using `.set()` or `.update()`?
A: The signal automatically detects the change and notifies all consumers.
B: The signal won't notify consumers because it uses reference equality for objects by default.
C: Angular throws a runtime error prompting you to use an immutable update pattern.
D: The signal will warn you in the console but still update dependents.
Why is using `computed()` generally preferred over `effect()` for deriving state that will be used elsewhere in the application or template?
A: Effects run asynchronously, which is unsuitable for state used in templates.
B: Computed signals are lazily evaluated and memoized, making them more efficient for state derivation than effects which run eagerly.
C: Effects cannot read other signals, only writable signals can.
D: Computed signals automatically clean up their dependencies, whereas effects can cause memory leaks.
What is the main purpose of the `linkedSignal` function (currently in Developer Preview)?
A: To create a signal that mirrors an RxJS Observable.
B: To establish a two-way data binding between a signal and a form control.
C: To create a signal whose state is intrinsically derived from another signal or computation, ensuring it always reflects the source.
D: To link multiple components together using a shared signal state.
What primary problem does the experimental `resource()` function aim to solve within Angular's signal ecosystem?
A: Managing complex component hierarchies.
B: Improving the performance of computed signals with many dependencies.
C: Integrating and managing state derived from asynchronous operations (like API calls) directly into the signal graph.
D: Providing a way to create signals that are automatically persisted to browser storage.
How would you properly test a component that uses signals in Angular?
A: You can't test components with signals using Angular's TestBed.
B: Use spyOn to mock signals and manually trigger change detection between signal updates.
C: Directly modify component properties and use detectChanges() to update the view, ignoring signals completely.
D: Interact with signals normally through component methods and use TestBed's change detection to see reflected updates in the DOM.
What is the effect of reading a signal's value inside the `untracked()` function?
A: It forces the signal to update its value immediately.
B: It prevents the current reactive context (like a `computed` or `effect`) from establishing a dependency on that signal.
C: It converts the signal into a non-reactive static value.
D: It throws an error if used outside of an `effect`.
Which of the following is a valid performance optimization when working with signals that hold large arrays or objects?
A: Always use JSON.stringify to compare objects for equality before updating signals.
B: Use structural sharing techniques when updating, modifying only the parts that changed while reusing unchanged portions.
C: Convert all signals to RxJS Observables for better performance with complex objects.
D: Split large objects into individual signals for each property to improve change detection.
Reactive vs. Template Driven Forms:
Setup of Form model?
Reactive vs. Template Driven Forms:
Data model?
Reactive vs. Template Driven Forms:
Data flow?
Reactive vs. Template Driven Forms:
Form validation?
what does ng build do?
Ocultar las fichas que te sabes