Angularjs xeditable保存答案

【问题标题】：Angularjs xeditable savingAngularjs xeditable保存
【发布时间】：2018-01-03 14:57:33
【问题描述】：

我有一个包含大约 30 个字段的表单，一旦用户编辑一个并关闭输入框，save($data, customer.custref) 函数会将数据和 id(custref) 传递给控制器。我遇到的问题是将数据转换为 json，然后通过补丁请求发送。

保存功能：

$scope.save = function(data, id){
    console.log(data);
    $http.patch(API_URL + "v1/customers/" + id, data)
        .then(function (response) {
            console.log("here");
        },function error(response) {
            console.log('error');
            $scope.error = response.statusText;
        });
};

HTML：

 <td data-title="'company'" >
     <p class="form-control-static"><a href="#" editable-text="customer.company" onbeforesave="save($data, customer.custref)">
          {{ customer.company || 'empty' }}
     </a></p>
 </td>

在代码 sn-p 中，我将 data 传递给补丁请求，但这需要是一个对象，否则它不是有效的 json：

$scope.updateObj = {

company: data.company ?? 

}

我以前做过类似的事情，没有 xeditable，我用过 ng-model 在输入字段上创建一个对象，如：

$scope.updateObj = {

company: $scope.company, 
name: $scope.name

}
$http.patch(API_URL + "v1/customers/" + id, updateObj){
//......

但我不能这样做，因为输入字段是为我生成的。我真的被卡住了，希望有任何帮助

【问题讨论】：

您能否提供一个示例，说明“数据”在进入 save() 函数后是什么？ console.log(data) 的结果是什么； ?
只是一个字符串。我通过$scope.updateObj = { company: data } 设法让它工作，但显然当我添加更多字段时它不会工作，因为它会覆盖它们

标签： angularjs json http

【解决方案1】：

您可以将属性名称作为参数传入以保存。

控制器

$scope.save = function(data, id, fieldName){
    console.log(data);

    var patchObj = {};
    patchObj[fieldName] = data;

    $http.patch(API_URL + "v1/customers/" + id, patchObj)
        .then(function (response) {
            console.log("here");
        },function error(response) {
            console.log('error');
            $scope.error = response.statusText;
        });
};

HTML

 <td data-title="'company'" >
     <p class="form-control-static"><a href="#" 
                                       editable-text="customer.company" 
                                       onbeforesave="save($data, customer.custref, 'company')">
          {{ customer.company || 'empty' }}
     </a></p>
 </td>

工作示例：https://plnkr.co/edit/mo1z4Ju4LiVF9zYGRoNW?p=preview

【讨论】：