ng-styleDirective AngularJS


Exemple

Ajoutez du style avec AngularJS, en utilisant un objet avec des clés et des valeurs CSS :

<body ng-app="myApp" ng-controller="myCtrl">

<h1 ng-style="myObj">Welcome</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>

Définition et utilisation

La ng-styledirective spécifie l'attribut de style pour l'élément HTML.

La valeur de l' ng-styleattribut doit être un objet ou une expression renvoyant un objet.

L'objet se compose de propriétés et de valeurs CSS, dans des paires clé-valeur.


Syntaxe

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

Pris en charge par tous les éléments HTML.


Valeurs des paramètres

Value Description
expression An expression which returns an object where the keys are CSS properties, and the values are CSS values.