Câu lệnh ng-style của AngularJS

Sách tham khảo AngularJS

Định nghĩa và cách sử dụng

ng-style Câu lệnh chỉ định style thuộc tính.

ng-style Giá trị của thuộc tính phải là đối tượng hoặc là biểu thức trả về đối tượng.

Đối tượng này được组成 từ các thuộc tính CSS và giá trị dưới dạng cặp khóa và giá trị.

Mẫu

Sử dụng đối tượng có khóa và giá trị CSS để thêm một số phong cách bằng AngularJS:

<body ng-app="myApp" ng-controller="myCtrl">
<h1 ng-style="myObj">Chào mừng</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>

Thử trực tiếp

Cú pháp

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

Tất cả các yếu tố HTML đều hỗ trợ.

Tham số

Tham số Mô tả
expression Cú pháp, trả về một đối tượng trong đó khóa là thuộc tính CSS, giá trị là giá trị CSS.

Sách tham khảo AngularJS