How to set scope property with ng-init

Question

I am trying to set the value of a  scope property using ng-init  and I am unable to access that value in the controller s javascript  What am I doing wrong   Here is a fiddle   http   jsfiddle net uce3H   markup    lt body ng-app gt       lt div ng-controller  testController   gt           lt input type  hidden  id  testInput  ng-model  testInput  ng-init  testInput  value     gt       lt  div gt         testInput     lt  body gt    javascript   var testController   function   scope         console log  scope testInput       In the javascrippt   scope testInput is undefined   Shouldn t be  value

User · Answer

I had some trouble with  scope  watch but after a lot of testing I found out that my data-ng-model  User UserName  was badly named and after I changed it to data-ng-model  UserName  everything worked fine  I expect it to be the   in the name causing the issue

User · Answer

Like CodeHater said you are accessing the variable before it is set   To fix this move the ng-init directive to the first div    lt body ng-app gt       lt div ng-controller  testController  ng-init  testInput  value   gt           lt input type  hidden  id  testInput  ng-model  testInput    gt            testInput         lt  div gt   lt  body gt    That should work

User · Answer

Just set ng-init as a function  You should not have to use watch     lt body ng-controller  MainCtrl  ng-init  init    gt     lt div ng-init  init  Blah    gt    testInput    lt  div gt   lt  body gt   app controller  MainCtrl      scope   function   scope       scope testInput   null     scope init   function value         scope testInput  value             Here s an example   Plunker

User · Answer

You are trying to read the set value before Angular is done assigning    Demo   var testController   function   scope   timeout        console log  test         timeout function            console log  scope testInput         1000       Ideally you should use  watch as suggested by  Beterraba to get rid of the timer   var testController   function   scope        console log  test         scope  watch  testInput   function            console log  scope testInput

User · Answer

Try this Code  var app   angular module  myapp          app controller  testController   function   scope   http            scope init   function                      alert  scope testInput               x000D   x000D   lt body ng-app  myapp  gt  x000D         lt div ng-controller  testController  data-ng-init  testInput  value   init     class  col-sm-9 col-lg-9   gt  x000D         lt  div gt  x000D   lt  body gt  x000D   x000D   x000D

User · Answer

HTML    lt body ng-app  App  gt       lt div ng-controller  testController   gt           lt input type  hidden  id  testInput  ng-model  testInput  ng-init  testInput 123    gt       lt  div gt         testInput     lt  body gt    JS   angular module  App         testController   function   scope        console log  test         scope  watch  testInput   testShow  true       function testShow           console log  scope testInput             Fiddle

[angularjs] How to set scope property with ng-init?

Examples related to angularjs