Angular exception Can t bind to ngForIn since it isn t a known native property

Question

What am I doing wrong   import  bootstrap  Component  from  angular2 angular2    Component     selector   conf-talks     template    lt div  ngFor  let talk in talks  gt         talk title   by   talk speaker         lt p gt   talk description       lt  div gt      class ConfTalks     talks      title   t1   speaker   Brian   description   talk 1                 title   t2   speaker   Julie   description   talk 2        Component     selector   my-app     directives   ConfTalks     template    lt conf-talks gt  lt  conf-talks gt      class App    bootstrap App        The error is  EXCEPTION  Template parse errors  Can t bind to  ngForIn  since it isn t a known native property    lt div  ERROR - gt   ngFor  let talk in talks  gt

User · Answer

Watching this course https   app pluralsight com library courses angular-2-getting-started-update discussion The author explains that new version of JavaScript has for of and for in  the for of is to enumerate objects and the for in is to enumerate the index of the array

User · Answer

In my case  WebStrom auto-complete inserted lowercased  ngfor  even when it looks like you choose the right camel cased one   ngFor

User · Answer

TL DR   Use let   of instead of let   in        If you re new to Angular   2 x  and possibly migrating from Angular1 x  most likely you re confusing in with of  As andreas has mentioned in the comments below for     of iterates over values of an object while for     in iterates over properties in an object  This is a new feature introduced in ES2015   Simply replace      lt  -- Iterate over properties  incorrect in our case here  -- gt   lt div  ngFor  let talk in talks  gt    with    lt  -- Iterate over values  correct way to use here  -- gt   lt div  ngFor  let talk of talks  gt    So  you must replace in with of inside ngFor directive to get the values

User · Answer

Q Can t bind to  pSelectableRow  since it isn t a known property of  tr    A you need to configure the primeng tabulemodule in ngmodule

User · Answer

my solution was - just remove     character from the expression        lt div ngFor  let talk in talks  gt

User · Answer

Since this is at least the third time I ve wasted more than 5 min on this problem I figured I d post the Q  amp  A  I hope it helps someone else down the road    probably me   I typed in instead of of in the ngFor expression   Befor 2-beta 17  it should be      lt div  ngFor   talk of talks  gt    As of beta 17  use the let syntax instead of    See the UPDATE further down for more info     Note that the ngFor syntax  desugars  into the following    lt template ngFor  talk  ngForOf   talks  gt     lt div gt     lt  div gt   lt  template gt    If we use in instead  it turns into   lt template ngFor  talk  ngForIn   talks  gt     lt div gt     lt  div gt   lt  template gt    Since ngForIn isn t an attribute directive with an input property of the same name  like ngIf   Angular then tries to see if it is a  known native  property of the template element  and it isn t  hence the error   UPDATE - as of 2-beta 17  use the let syntax instead of     This updates to the following    lt div  ngFor  let talk of talks  gt    Note that the ngFor syntax  desugars  into the following    lt template ngFor let-talk  ngForOf   talks  gt     lt div gt     lt  div gt   lt  template gt    If we use in instead  it turns into   lt template ngFor let-talk  ngForIn   talks  gt     lt div gt     lt  div gt   lt  template gt

User · Answer

There is an alternative if you want to use of and not switch to in  You can use KeyValuePipe introduced in 6 1  You can easily iterate over an object     lt div  ngFor  let item of object   keyvalue  gt      item key     item value    lt  div gt

User · Answer

My problem was  that Visual Studio somehow automatically lowercased  ngFor to  ngfor on copy amp paste

User · Answer

Try to import import   CommonModule   from   angular common   in angular final as  ngFor   ngIf all are present in CommonModule

[angular] Angular exception: Can't bind to 'ngForIn' since it isn't a known native property

Examples related to angular

Examples related to angular2-directives