AngularJS ng-style instructie

AngularJS Reference Manual

definitie en gebruik

ng-style De instructie specificeert de style attribuut.

ng-style De waarde van het attribuut moet een object zijn of een expressie die een object retourneert.

De waarde van het attribuut moet een object zijn of een expressie die een object retourneert.

Voorbeeld

Gebruik een object met CSS-sleutels en -waarden om enkele stijlen toe te voegen met AngularJS:

<body ng-app="myApp" ng-controller="myCtrl">
<h1 ng-style="myObj">Welkom</h1>
<script>
var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
    $scope.myObj = {
        "color" : "white",
        "background-color" : "coral",
        "font-size" : "60px",
        "padding" : "50px"
    }
});
</script>
</body>

Try it yourself

Syntax

<element ng-style="expression</element>

All HTML elements support.

Parameters

Parameters Description
expression The expression returns an object with keys as CSS properties and values as CSS values.

AngularJS Reference Manual