css - 两个输入文件同时设置为禁用

Question

您好，我有两个输入文件，上传文件后应该分别禁用它们。但是当我尝试上传第一个文件时使用下面的代码，两个文件输入同时被禁用。如何将代码更改为使其单独禁用。

    angular
      .module('app', [])
      .controller('ctrl', function($scope) {
        $scope.disabled = true;
      });
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

    <style>
      .ng-disabled {
        background: #E9B96E;
      }
    </style>

    <span ng-app="app" ng-controller="ctrl">
    <input type="file" ng-class="{'ng-disabled': disabled}" ng-disabled="disabled" id="input1" />
    <input type="file" ng-class="{'ng-disabled': disabled}" ng-disabled="disabled" id="input2"/>
    </span>

Answer 1

您对两个字段使用相同的 $scope 变量，因此两个输入的 react 相同也就不足为奇了。使用单独的 $scope 变量来解决这个问题。

我可以为您提供复制和粘贴解决方案，但我觉得如果让您寻找解决方案，既然您知道问题所在，您可以学到很多东西。