Question

我创建了一个编辑按钮和一个表单。我无法禁用我的输入直到单击编辑按钮。
我想做的就是禁用输入，当用户点击编辑按钮时，他们应该可以编辑文本。

这是我的代码：

<div ng-controller="MyCtrl">
    <a class="edit" ng-click="inactive = !inactive">Edit</a>

    <form>
        <b>First Name:</b>
        <input type="text" ng-disabled="inactive" ng-model="input1" value="John">
        <br>
        <b>Last Name:</b>
        <input type="text" ng-disabled="inactive" value="Smith">
        <br>
        <b>Email:</b>
        <input type="email" ng-disabled="inactive" value="jsmith@email.com">
    </form>
</div>

App.js

function MyCtrl($scope) {
    $scope.inactive = false;
}

Answer 1

你可以添加纳克单击=＆＃34; changeStatus（）＆＃34; 在角度模板中。

完整代码：

var app = angular.module("Portal", ['ngRoute']);
app.controller('MyCtrl', ['$scope', function($scope) {
   $scope.inactive = true;
   $scope.changeStatus = function() {
      $scope.inactive = !$scope.inactive;
   };
}]);

Answer 2

要修复代码，必须反转布尔变量：

function MyCtrl($scope) {
    $scope.inactive = true;
}

但要以更干净的方式停用整个表单输入，请将所有输入放在包含ng-disabled的字段集中，并从每个输入中删除ng-disabled ...

<form> 
    <fieldset ng-disabled="inactive">
        <b>First Name:</b>
        <input type="text" ng-model="name"><br>
        <b>Last Name:</b>
        <input type="text" ng-model="lastname"><br>
        <b>Email:</b>
        <input type="email" ng-model="email">
    </fieldset>
</form>

如何在AngularJS中单击编辑按钮之前禁用输入文本？

2 个答案: