Displaying Data

Question 1

Interpolation example

Answer 1

{{interpolated content}}

Question 2

Interpolation example

Answer 2

{{interpolated content}}

Question 3

How do you write multiline string

Answer 3

The backtick: ‘

Question 4

declare a component in html

Question 5

Structural direct for if statements

Answer 5

*ngIf=”booleanExpression; then templateForFalse

Question 6

declare a component in html

Question 7

Structural directive for for loops

Answer 7

*ngFor=”let item of items”

Question 8

Structural direct for if statements

Answer 8

*ngIf=”booleanExpression; then templateForFalse

Question 9

Declare a template reference variable to refer to element tags.

Answer 9

#variableName
Useful Fact: takes precedence over other variables available in the template

Question 10

Do templates have access to global variables such as “window” or “document”?

Answer 10

Nope

Question 11

Rules for template expressions

Answer 11

No visible side effects
Quick execution
Simplicity
Idempotence

Question 12

Action triggered by event raised that is binding a an element, component, or directive.

Answer 12

Template statement

Question 13

Which can chain statements and assign values? Template expression or template statements?

Answer 13

Template statements

Question 14

One way from source to view target binding

Answer 14

{{expression}}
[target]=”expression”
bind-target=”expression”

Question 15

One-way
from view target
to data source

Answer 15

(target)=”statement”

on-target=”statement”

Question 16

Two-way

Answer 16

[(target)]=”expression”

bindon-target=”expression”

Question 17

Difference between html properties and attributes.

Answer 17

Attributes initialize properties. Properties can change.

Question 18

Class property bindng

Answer 18

<div><div></div></div>

Question 19

Input binding

Answer 19

<div></div>

Question 20

Attribute binding example

Question 21

class binding example

Answer 21

<div></div>

Question 22

Style binding example

Answer 22

<div></div>

Question 23

Style binding example with value type example

Answer 23

Big

Question 24

Directive (attribute) event binding

Answer 24

<div>click with myClick</div>

Attribute Directive: clickable
Directive Event: myClick

Question 25

EventEmitter example

Answer 25

// Inside child component
deleteRequest = new EventEmitter();
delete() {
  this.deleteRequest.emit(this.hero);
}
// inside parent template

Question 26

template variable for an event when event binding

Answer 26

$event

event)=actionHandlingEventParam($event

Question 27

Two way binding equivalence example

Question 28

NgModel Binding with change

Answer 28

[ngModel]=”currentHero.name”

(ngModelChange)=”doSomething($event)”>

Question 29

NgStyle binding

Answer 29

div [ngStyle]=”{
‘styleVar1’: boolExpression1,
‘styleVar2’: boolExpression2
}”

Question 30

NgModel binding

Answer 30

// Module inport FormsModule

Question 31

NgModel Binding with change

Answer 31

[ngModel]=”currentHero.name”

(ngModelChange)=”doSomething($event)”>

Question 32

Output Binding

Answer 32

@Output(“aliasName”)

public name :EventEmitter?;

Question 33

NgSwitch example

Answer 33

<div>

</div>

Question 34

Input Binding

Answer 34

@Input(“aliasName”)

public inputVarName?;

Question 35

Output Binding

Answer 35

@Output(“aliasName”)

public name :EventEmitter?;

Question 36

null operator

Answer 36

{{nullObject?.name}}

Question 37

assert not null operator to indicate that the variable can’t be null

Answer 37

{{nullObject!.name}}

Question 38

any type conversion in template

Answer 38

$any(expression).anyProperty

Question 39

pipe example

Answer 39

{{expression | converter}}