Question

   .controller('ImageChangeController', function($scope, $http, $element){
        $scope.itemid = '';

        reader = new FileReader();
        file_inputs = $element.children('.img-change');
        img_doc = $element.children('img').get(0);

        file_inputs.change(function(e){
            reader.onload = function(e) {
                img_doc.src = e.target.result;
            }
            $scope.itemid = "999"; //does not work

        });

      $scope.change_name = function(){
         $scope.itemid = "999";
      }

这是我的模板代码：

    <div  ng-controller="ImageChangeController">
    <span>{{itemid}}</span>
    <input type="file" class="img-change" name="{{itemid}}"  accept="image/*">
    </div>

如果我将itemid更改为ng-click="change_itemid()"，则效果会很好。

Answer 1

基本上，您应该使用angular指令而不是非本机元素： http://ngmodules.org/modules/ng-file-upload

如果你想在不改变实现的情况下解决问题（例如，direcitve没有提供你想要的功能）：

问题来源是代码的这一部分：

    file_inputs.change(function(e){
        reader.onload = function(e) {
            img_doc.src = e.target.result;
        }
        $scope.itemid = "999"; //does not work

    });

在角度摘要周期之外调用该函数。你应该告知有关变化的角度：

    file_inputs.change(function(e){
        reader.onload = function(e) {
            img_doc.src = e.target.result;
            $scope.$applyAsync();
        }
        $scope.itemid = "999"; //does not work
        $scope.$applyAsync();
    });

控制器的属性不会改变动态

1 个答案: