Question

我有以下事件处理程序：

$scope.$on("fileSelected", function (event, data) {

        switch (data.model) {
            case "ImageFile":
                self.item.ImageFile = data.file;
                self.item.ImageFileName = data.file.name;
                break;
           default:
                self.item.IconFile = data.file;
                self.item.IconFileName = data.file.name;

        }

    });

该方法确实按预期执行。但是，在执行上述方法时更新self.item.IconFileName的值不会在ui中更新。下面是我的HTML。

<input id="IconFile" class="form-control control-label col-md-2" type="text" ng-bind="cc.item.IconFileName">

我错过了什么？

Answer 1

我需要调用$ scope.apply

$scope.$on("fileSelected", function (event, data) {

          $scope.$apply(function() {
            switch (data.model) {
            case "PromotionalLargeImageFile":
                self.item.PromtionalLargeImageFile = data.file;
                self.item.PromtionalLargeImageFileName = data.file.name;
                break;
            case "PromotionalThumbnailImageFile":
                self.item.PromotionalThumbnailImageFile = data.file;
                self.item.PromotionalThumbnailImageFileName = data.file.name;
                break;
            default:
                self.item.MiniMiniIconFile = data.file;
                self.item.MiniMiniIconFileName = data.file.name;
            }

        });

});

Answer 2

如果可能，您应该使用$timeout代替$scope.$apply。 $scope.$apply可能会引发 $digest already in progress 错误。有关详细信息，您可以看到此答案Angular $scope.$apply vs $timeout as a safe $apply

$scope.$on("fileSelected", function (event, data) {
       $timeout(function() {
            switch (data.model) {
               case "PromotionalLargeImageFile":
                  self.item.PromtionalLargeImageFile = data.file;
                  self.item.PromtionalLargeImageFileName = data.file.name;
                  break;
              case "PromotionalThumbnailImageFile":
                  self.item.PromotionalThumbnailImageFile = data.file;
                  self.item.PromotionalThumbnailImageFileName = data.file.name;
                  break;
              default:
                  self.item.MiniMiniIconFile = data.file;
                  self.item.MiniMiniIconFileName = data.file.name;
            }
      });
});

在事件上更新文本框值$

2 个答案: