Javascript AngularJS绑定表，尽管单击取消或取消更改

var FormModule=angular.module'FormModule'，[]； FormModule.ControlPerformCtrl，函数$scope，$http，$uibModal，$rootScope{ $scope.dataItems=[{id:1，name:bla，Description:blabla}， {id:2，名称：bla，描述：blabla}]； //函数编辑 $scope.editColumn=函数数据{ var ObjResolve=函数{ 返回数据； } $uibModal.open{ 动画：没错， templateUrl:'dataModal.html'， 控制器：“ModalInstanceCtrl”， 决心：{ 目标解决方案 } }.result.catchfunction res{ 如果！res==“取消”| res==“退出按键”{ //投掷物； } }; }; }; FormModule.controllerModalInstanceCtrl，函数$scope，$uibModalInstance，$http，ObjResolve，$rootScope{ $scope.data=ObjResolve； }; 可乐 可乐 选择权 {{data.name} {{data.Description} 编辑 业务类型 名称 描述 拯救 取消

---

如果没有代码，很难提供帮助，但在编辑时很可能会出现这种情况，尽管按“取消”键，但该值已绑定，因此按“取消”键不是“撤消”按钮，它只会关闭“编辑”选项

---

您可能需要以不同的方式加载数据，但正如我所说的，如果不看到数据，很难判断。希望这有帮助

在这种情况下，当您单击打开模型，然后声明另一个对象，并以编辑形式存储要更改其属性的对象，然后单击“取消”按钮，再次将克隆的对象变量放入从中克隆的原始对象中时，将解决您的问题

谢谢

---

Sanjeet

问题在于，在dataModal.html视图中，您在具有唯一ObjResolve实例的输入中使用双向数据绑定，因此当您在模式中编辑输入时，更改将填充到对象中

我要做的是在传递到模态时复制对象，并在您接受更改时将其分配回：

AngulaJS代码

HTML代码

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js" </script>
<table>
                <thead>
                    <tr>
                        <th>
                           col1
                        </th>
                        <th>
                            col2
                        </th>

                        <th>
                            Options
                        </th>
                    </tr>

                </thead>
                <tbody>
                    <tr ng-repeat="data in  dataItems">
                        <td>{{ data.name }}</td>
                        <td>{{ data.Description }}</td>

                        <td>
                            <a ng-click="editColumn(data)" id="btnEdit">Edit</a>
                        </td>
                    </tr>
                </tbody>
            </table>
        <script type="text/ng-template" id="dataModal.html">
            <form name="modalForm">
                <div class="modal-header">
                    <h3 class="modal-title">Business Types</h3>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div class="col-sm-6">
                            <label>name</label>
                            <input type="text" class="form-control"  ng-model="data.name" ng-readonly="isReadOnly" />

                        </div>
                        <div class="col-sm-6">
                            <label>Description</label>
                            <input type="text" class="form-control"  ng-model="data.Description"  />

                        </div>
                    </div>


                </div>
                <div class="modal-footer">
                    <button class="btn btn-success" type="button" ng-click="onAccept()">
                        Save
                    </button>
                    <button class="btn btn-danger" type="button" ng-click="cancel()">Cancel</button>
                </div>
            </form>

        </script>

更新

---

使用所描述的解决方案添加了一个JSFIDLE

您可以添加一些示例代码吗？如果没有它，将无法帮助我添加一个示例请检查@JavierFromMadridI添加一个示例请检查您是否有一些示例或支持文档的解释？回答很好，但现在我在接受时遇到了一个问题，表中仍然保留旧的对象值，以便在接受更改时直接更改$scope.items中所需的项是的，我知道这是我所期望的，但实际上，当单击“接受未更新的对象”时，您是否检查了示例中的.result.then函数？哎哟！我没有保存JSFIDLE，所以它不是我所做的。我将在以后再次创建，并确保它已保存。再次抱歉

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js" </script>
<table>
                <thead>
                    <tr>
                        <th>
                           col1
                        </th>
                        <th>
                            col2
                        </th>

                        <th>
                            Options
                        </th>
                    </tr>

                </thead>
                <tbody>
                    <tr ng-repeat="data in  dataItems">
                        <td>{{ data.name }}</td>
                        <td>{{ data.Description }}</td>

                        <td>
                            <a ng-click="editColumn(data)" id="btnEdit">Edit</a>
                        </td>
                    </tr>
                </tbody>
            </table>
        <script type="text/ng-template" id="dataModal.html">
            <form name="modalForm">
                <div class="modal-header">
                    <h3 class="modal-title">Business Types</h3>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div class="col-sm-6">
                            <label>name</label>
                            <input type="text" class="form-control"  ng-model="data.name" ng-readonly="isReadOnly" />

                        </div>
                        <div class="col-sm-6">
                            <label>Description</label>
                            <input type="text" class="form-control"  ng-model="data.Description"  />

                        </div>
                    </div>


                </div>
                <div class="modal-footer">
                    <button class="btn btn-success" type="button" ng-click="onAccept()">
                        Save
                    </button>
                    <button class="btn btn-danger" type="button" ng-click="cancel()">Cancel</button>
                </div>
            </form>

        </script>