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>

标签： cssangularjs

Answer 1

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

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