angular-cn/public/docs/js/latest/api/directives/NgStyle-class.jade

p.location-badge.
  exported from <a href='../directives'>angular2/directives</a>
  defined in <a href="https://github.com/angular/angular/tree/2.0.0-alpha.32/modules/angular2/src/directives/ng_style.ts#L7-L62">angular2/src/directives/ng_style.ts (line 7)</a>

:markdown
  Adds or removes styles based on an {expression}.
  
  When the expression assigned to `ng-style` evaluates to an object, the corresponding element
  styles are updated. Style names to update are taken from the object keys and values - from the
  corresponding object values.
  
  # Example:
  
  ```
  <div ng-style="{'text-align': alignEpr}"></div>
  ```
  
  In the above example the `text-align` style will be updated based on the `alignEpr` value
  changes.
  
  # Syntax
  
  - `<div ng-style="{'text-align': alignEpr}"></div>`
  - `<div ng-style="styleExp"></div>`
  
  

.l-main-section
  h2 Annotations
  .l-sub-section
    h3.annotation Directive
    pre.prettyprint
      code.
        @Directive({
          selector: &#39;[ng-style]&#39;,
          lifecycle: [LifecycleEvent.onCheck],
          properties: [&#39;rawStyle: ng-style&#39;]
        })


.l-main-section
  h2 Members
  .l-sub-section
    h3 constructor

    
    pre.prettyprint
      code.
        constructor(_pipes: Pipes, _ngEl: ElementRef, _renderer: Renderer)
    
    :markdown
      
      




  .l-sub-section
    h3 rawStyle

    
    :markdown
      
      





  .l-sub-section
    h3 onCheck

    
    pre.prettyprint
      code.
        onCheck()
    
    :markdown