，我們來看一個簡單的例子：
假設我們有一個按鈕，當用戶點擊按鈕時，它的顏色會變成紅色。
<button ng-click="changeStyle()">點擊改變樣式</button>
在上面的代碼中，我們給按鈕添加了一個點擊事件（ng-click="changeStyle()"），當用戶點擊按鈕時，會觸發changeStyle()函數。接下來，我們需要在控制器中定義changeStyle()函數，并在函數中改變按鈕的樣式。
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.changeStyle = function() {
$scope.style = {'color': 'red'};
}
});
</script>在上面的代碼中，我們創建了一個AngularJS應用，并定義了一個控制器（myCtrl）。在控制器中，我們定義了changeStyle()函數，它會通過給$scope對象的style屬性賦值來改變按鈕的樣式。在這里，我們使用了一個對象來表示按鈕的樣式，對象的鍵是CSS屬性名，值是對應的屬性值。這樣，當用戶點擊按鈕時，AngularJS會更新$scope對象的style屬性，從而改變按鈕的樣式。
下面，我們來看一個更復雜的例子：
假設我們有一個列表，列表中的每一項都有一個初始的背景顏色。當用戶點擊列表項時，被點擊的列表項的背景顏色會變成紅色，而其他列表項的背景顏色則保持不變。
<ul ng-controller="myCtrl">
<li ng-repeat="item in items" ng-style="itemStyle[item.id]">{{item.name}}</li>
</ul>在上面的代碼中，我們創建了一個控制器，并在控制器中定義了一個數組（items）。然后，我們使用ng-repeat指令來遍歷數組中的每一項，并將每一項渲染為一個列表項。關鍵在于，我們在列表項上使用了<div ng style>指令，并通過ng-style="itemStyle[item.id]"設置了樣式。
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.items = [
{id: 1, name: 'Item 1'},
{id: 2, name: 'Item 2'},
{id: 3, name: 'Item 3'},
];
<br>
$scope.itemStyle = {};
<br>
$scope.changeStyle = function(itemId) {
$scope.itemStyle[itemId] = {'background-color': 'red'};
}
});
</script>在上面的代碼中，我們定義了一個數組（items），其中每一項都有一個唯一的id和一個name。然后，我們在控制器中定義了一個空對象（itemStyle），它用于保存列表項的樣式。當用戶點擊列表項時，changeStyle()函數會通過給$scope.itemStyle對象的特定屬性賦值來更新對應列表項的樣式。這樣，被點擊的列表項的背景顏色會變成紅色。
<div ng style>的靈活性和強大功能使其成為AngularJS中常用的指令之一。通過它，我們可以根據特定的條件動態地改變元素的樣式，帶來更好的用戶體驗和交互效果。無論是改變按鈕的顏色還是改變列表項的背景顏色，<div ng style>都能幫助我們輕松實現。因此，掌握好<div ng style>的用法將對我們開發AngularJS應用非常有幫助。