W3cubDocs

/Angular 4 TypeScript

NgStyle

Stable Directive

What it does

Update an HTML element styles.

How to use

<some-element [ngStyle]="{'font-style': styleExp}">...</some-element>

<some-element [ngStyle]="{'max-width.px': widthExp}">...</some-element>

<some-element [ngStyle]="objExp">...</some-element>

Class Overview

class NgStyle implements DoCheck {
  constructor(_differs: KeyValueDiffers, _ngEl: ElementRef, _renderer: Renderer)
  
  
  ngStyle 
  ngDoCheck()
}

Selectors

[ngStyle]

Class Description

The styles are updated according to the value of the expression evaluation:

  • keys are style names with an optional .<unit> suffix (ie 'top.px', 'font-style.em'),
  • values are the values assigned to those properties (expressed in the given unit).

Constructor

constructor(_differs: KeyValueDiffers, _ngEl: ElementRef, _renderer: Renderer)

Class Details

ngStyle
ngDoCheck()

exported from common/index, defined in common/src/directives/ng_style.ts

© 2010–2017 Google, Inc.
Licensed under the Creative Commons Attribution License 4.0.
https://angular.io/docs/ts/latest/api/common/index/NgStyle-directive.html