我有一个可以编辑的表格。但是,如果我使用分页更改页面,则会删除已编辑的值。我尝试在更改页面时调用我的保存功能,但这样做也不行 我有一张这样的表:
...
<table>
...
<th>
<span class="input-group-btn">
<button type="button" class="btn btn-default" ng-show="!valueForm.$visible" ng-click="valueForm.$show()">
Edit
</button>
</span>
</div>
<form editable-form name="valueForm" onaftersave="$ctrl.saveColumn('valueTranlate')" ng-show="valueForm.$visible">
<button type="submit" ng-disabled="valueForm.$waiting" class="btn btn-primary">
Save
</button>
<button type="button" ng-disabled="valueForm.$waiting" ng-click="valueForm.$cancel()" class="btn btn-default">
Cancel
</button>
</form>
</th>
...
<tr dir-paginate="v in my array>
...
</table>
<dir-pagination-controls auto-hide="false" on-page-change="$ctrl.saveColumn()" boundary-links="true" max-size='7'></dir-pagination-controls>
...
my .js
saveColumn() {
if (this.$scope.valueForm.$visible) {
angular.forEach(this.langV, (value) => {
this.$http.patch('/api/dict_values/' + value.v_id, {
id: value.v_id,
value: value.value2,
user_id: this.currentUser()._id,
key_id: value._id,
lang_id: this.$scope.select2
});
});
this.showLang(this.$scope.select1, this.$scope.select2);
}
}
因此调用saveColumn()
它会迭代每个页面上的所有字段并保存值,但不会保存其他页面的编辑,因为它们已被“删除”。尝试在更改页面时调用save()
,但值的删除速度比save()
快。
那么我怎样才能实现我可以在每个页面上编辑,如果我更改了页面,则不会忘记值?
答案 0 :(得分:1)
我通过添加一个&#34;记住&#34;所有编辑的价值。
每次发生事情时,我都会在我的Textarea中添加一个ng-change来触发这个Factory。
<span editable-textarea="v.value2" e-ng-change="$ctrl.remember(v,$data)" e-name="valueTranslate" e-form="valueForm" e-rows="3" e-cols="25" onbeforesave="$ctrl.checkName($data)">
{{v.value2 || '' }}
</span>
首先调用remember(v,$data)
函数
// Remember Edits for Pagination
remember(obj, data) { //obj-> actual edited, data -> the input
if (obj.close === undefined || obj.close === '' || obj.close === null) {
obj.close = obj.value2;
}// Attaching a Close property for the Case the User cancel the Edits
obj.value2 = data;// saving the Edits in value2, this is which is get send to DB
this.rememberValues.addValue(obj); // and send to Factory
}
然后将其保存在我的工厂中,以便编辑不会被ChangePange删除
.factory('rememberValues', () => {
var valuesE = [];
var savingValue;
return {
values: () => {
return [].concat(valuesE);//for output and saving,contains all edited fields
},
addValue: (obj) => {//adding in Array
savingValue = _.find(valuesE, function(value) {
return value._id === obj._id;
});
if (savingValue) {
savingValue.value2 = obj.value2;
} else {
valuesE.push(obj);
}
},
clear: () => {//if I want to clear the Array
angular.forEach(valuesE, (value) => {
delete value.close;
});
valuesE = [];
},
cancel: () => {// The User Cancels the Edits
angular.forEach(valuesE, (value) => {
value.value2 = value.close;// Original Value is put in again
delete value.close;
});
valuesE = [];
}
};
})