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';
        });
    };
});

Angularjs ns-style通过Controller进行更改

1 个答案:

Working example