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
Post a Comment