angularjs - 通过控制器更改 Angularjs ns 样式

Question

我正在尝试更改 div 的背景颜色。我的html代码如下：

<div ng-style="{'background-color': backgroundImageInfo}">
    <input type="file" onchange="angular.element(this).scope().fileThatChangeBackground(this)" />
</div>

在控制器中挖掘 js 代码：

$scope.backgroundImageInfo='red';
$scope.fileThatChangeBackground = function() {
    alert($scope.backgroundImageInfo);
    $scope.backgroundImageInfo='blue';
};

控制器的第一行将背景颜色更改为红色。当我将文件设置为输入警报时显示“红色”并且没有将背景颜色更改为蓝色。当我更改输入文件（触发功能）警报显示“蓝色”并且再次没有更改背景颜色。当我从函数更改值时，为什么 ng-style 不改变颜色？

Answer 1

由于您是从 Angular 外部调用该函数，因此如果您希望它工作fileThatChangeBackground，您将需要这样做。$scope.$apply像这样：

angular.module('testApp',[])
.controller('testCtrllr', function($scope){
    $scope.backgroundImageInfo='red';    
    $scope.fileThatChangeBackground = function(scope) {                    
        $scope.$apply(function(){
            $scope.backgroundImageInfo='blue';
        });
    };
});

工作示例