AngularJS ng src不会在$rootScope上使用$watch进行更新

AngularJS ng-src does not update using $watch on $rootScope

本文关键字：watch 更新 rootScope src ng AngularJS      更新时间：2023-09-26

我正在使用$rootScope来获取和更新化身。现在，当用户更新新的化身时，的ng-src也应该更新，显示刚刚上传的新化身。

我通过观看控制器中的$rootScope.myAvator并将$scope.myAvatar设置为newValue来实现这一点。不幸的是，在这种情况下，ng-src没有更新。我读过很多关于ng-src和null值问题的问题，但这只是$scope的一个更改，我不明白为什么更新$scope.myAvatar不会导致ng-src的更改。我已尝试手动调用$scope$apply（），它不起作用，因为$rootScope仍在消化中。

router.js:

...
.when('/account', {
            'templateUrl': 'components/account/account.tpl.html',
            'controller': 'accountCtrl as ctrl',
            'auth': true,
            'reloadOnSearch': false
        })
...

控制器作为ctrl:

function accountCtrl($scope, $rootScope, accountService) {
var vm = this;
accountService.getAvatar().then(function(res) {
    vm.myAvatar = res;
});
$rootScope.$watch('myAvatar', function (newValue, oldValue) {
    if (newValue) {
       vm.myAvatar = $rootScope.myAvatar;
    }
});
}

和html:

<img ng-src="{{ctrl.myAvatar}}" alt="avatar" width="100" height="100"/>

我认为您的路由器配置错误。尝试以下方法：

...
.when('/account', {
    'templateUrl': 'components/account/account.tpl.html',
    'controller': 'accountCtrl',
    'controllerAs': 'ctrl'
    'auth': true,
    'reloadOnSearch': false
})
...
相关文章：