angular - Difference between inputProperty="data.x" and inputProperty="{{data.x}}" -


in application, have defined component, takes 2 variables: start , end. run in ngfor follows:

 <template ngfor #exampledata [ngforof]="data" #idx="index">         <div>             <example-component start="exampledata.star" end="exampledata.end" *ngif="exampledata.start" ></example-component>         </div>  </template> 

you can see in plnkr

as can see, code provides example-component string of either exampledate.start or exampledata.end.

it run intended when add expression component that:

 <template ngfor #exampledata [ngforof]="data" #idx="index">         <div>             <example-component start="{{exampledata.star}}" end="{{exampledata.end}}" *ngif="exampledata.start" ></example-component>         </div>  </template> 

my question is: why that?

you leverage property binding parameters:

<template ngfor #exampledata [ngforof]="data" #idx="index">   <div>     <example-component [start]="exampledata.star"                        [end]="exampledata.end" *ngif="exampledata.start" >     </example-component>   </div> </template> 

this way content provided these 2 parameters evaluated expressions.

without [...], considered strings. in following, input values start , end respectively exampledata.star , exampledata.end:

<example-component start="exampledata.star"                    end="exampledata.end" *ngif="exampledata.start" > </example-component> 

Comments

Popular posts from this blog

java - Run spring boot application error: Cannot instantiate interface org.springframework.context.ApplicationListener -

python - pip wont install .WHL files -

Excel VBA "Microsoft Windows Common Controls 6.0 (SP6)" Location Changes -