Set angular scope variable in markup

Question

Simple question   How can I set a scope value in html  to be read by my controller     x000D   x000D  var app   angular module  app        x000D   x000D  app controller  MyController   function  scope    x000D    console log  scope myVar   x000D      x000D   lt script src  https   ajax googleapis com ajax libs angularjs 1 2 23 angular min js  gt  lt  script gt  x000D   lt div ng-app  app  gt  x000D     lt div ng-controller  MyController  app-myVar  test  gt  x000D        myVar   x000D     lt  div gt  x000D   lt  div gt  x000D   x000D   x000D    JSFiddle   http   jsfiddle net ncapito YdQcX

User · Answer

Create a directive called myVar with  scope     myVar          and call it like this    lt div name  my map  my-var  Richmond VA  gt    Note in particular the camel case reference in the directive to the hyphenated tag name   For more information see  Understanding Transclusion and Scopes  here - http   docs angularjs org guide directive  Here s a Fiddle that shows how you can copy values from attributes to scope variables in various different ways within a directive

User · Answer

If you not in a loop  you can use ng-init else you can use     var foo        the    alows not display your var

User · Answer

ng-init does not work when you are assigning variables inside loop  Use   myVariable whatever       The trailing    stops the Angular expression being evaluated to any text   Then you can simply call   myVariable   to output your variable value   I found this very useful when iterating multiple nested arrays and I wanted to keep my current iteration info in one variable instead of querying it multiple times

User · Answer

I like the answer but I think it would be better that you create a global scope function that will allow you to set the scope variable needed   So in the globalController create   scope setScopeVariable   function variable  value        scope variable    value      and then in your html file call it    setScopeVariable  myVar    whatever       This will then allow you to use  scope myVar in your respective controller

User · Answer

You can use ng-init as shown below   lt div class  TotalForm  gt     lt label gt B W Print Total lt  label gt     lt div ng-init    BWCount  oMachineAccounts sumByKey  BWCOUNT      gt   BWCount   lt  div gt   lt  div gt   lt div class  TotalForm  gt     lt label gt Color Print Total lt  label gt     lt div ng-init    ColorCount  oMachineAccounts sumByKey  COLORCOUNT      gt   ColorCount   lt  div gt   lt  div gt    and then use the local scope variable in other sections    lt div gt Total  BW    BWCount   lt  div gt   lt div gt Total  COLOR    ColorCount   lt  div gt

User · Answer

ngInit can help to initialize variables    lt div ng-app  app  gt       lt div ng-controller  MyController  ng-init  myVar  test   gt            myVar        lt  div gt   lt  div gt    jsfiddle example

User · Answer

scope  watch  myVar   function  newValue  oldValue            if  typeof  newValue       undefined                  scope someothervar  newValue    or get some data             getData                       true     Variable initializes after controller so you need to watch over it and when it t initialized the use it

User · Answer

You can use the ng-value directive in a hidden field as below  -  lt input type  quot hidden quot  ng-value  quot myScopeVar   someValue quot   gt   This will set the value of the scope variable  myScopeVar  to  quot someValue quot

User · Answer

You can set values from html like this  I don t think there is a direct solution from angular yet      lt div style  visibility  hidden   gt   activeTitle  home    lt  div gt

[angularjs] Set angular scope variable in markup

Examples related to angularjs

Examples related to angularjs-scope