javascript - 使用 angularJS 使所有字段在点击时可编辑

Question

这是 HTML，其中有用于获取列表的 ng-repeat，以及最初已卡住的 ng-readonly，在 JS 中点击功能已发布

<tr ng-repeat= "employeeDetail in employeeDetails">
                    <div ng-readonly="isReadonly">
                      <td><a><span>{{employeeDetail.empName}}</a></td>
                      <td>
                        <div ng-if="employeeDetail.departmentName">
                            {{employeeDetail.departmentName}}
                        </div>
                        <div ng-if="!employeeDetail.departmentName">
                            Not Specified
                        </div>
                        </td>
                      <td>
                        {{employeeDetail.empEmail}}
                      </td>
                      <td>{{employeeDetail.empContact}}</td>
                      <td>
                            <i class="fa fa-edit" ng-click="updateEmp()">
                      </td>
                    </div>
                  </tr>

这是附在上面的 JS 文件，我想要的是让所有字段都可以在点击时编辑，

$scope.isReadonly = false;
        $scope.addEmployeeType = function(){
            var employeeDetail = new employeeDetailApi();
            $scope.employeeDetails = employeeDetail.list;
        }
        $scope.updateEmp =  function (){
            $scope.isReadonly = true;
            console.log("update Employee");
        }

Answer 1

试一试......

<tr ng-repeat= "employeeDetail in employeeDetails">
    <div ng-click="isReadonly==true">
        <td><input type="text" ng-value="employeeDetail.empName" ng-readonly="isReadonly"></td>
        <td><input type="text" ng-value="employeeDetail.departmentName" ng-readonly="isReadonly"></td>
        <td><input type="text" ng-value="employeeDetail.empEmail" ng-readonly="isReadonly"></td>
        <td><input type="text" ng-value="employeeDetail.empContact" ng-readonly="isReadonly"></td>
        <td>
            <i class="fa fa-edit" ng-click="updateEmp()">
        </td>
    </div>
</tr>