Question

我正在一个有趣的小项目中使用angular，node，express和postgresql / sequelize。然而，它变得有点太有趣了。我是新手，在这种环境下开发，所以我可能会使用一些不正确的结构。但是，我正在尝试为模型设置更新路线。用于更新的JS似乎很好，因为它应该这样做，但问题是当调用函数并启动post方法时，它不会从html中的表单组中获取值。

这是html / angular的片段：

<div class="container">
  <div ng-controller="SomethingCtrl">
    <form ng-submit="updateSomething(updateform)" role="form" ng-init="updateform = {}">
      <div class="datagrid"><table>
        <thead>
        <tr>
          <th> ID </th>
          <th> field1 </th>
          <th> field2 </th>
          <th> field3 </th>
        </tr>
        </thead>
        <tbody>
        <tr ng-repeat="something in somethings | filter:{id:somethingId} | orderBy:'id' | limitTo: 1 track by $index">
          <td>
            {{something.id}}
          </td>
          <td>
            <div class="form-group">
              <input class="form-control" type="text" name="field1" value="{{something.field1}}"/>
            </div>
          </td>
          <td>
            <div class="form-group">
              <input class="form-control" type="text" name="field2" value="{{something.field2}}">
            </div>
          </td>
          <td>
            <div class="form-group">
              <input class="form-control" type="number" name="field3" value="{{something.field3}}">
            </div>
          </td>
        </tr>
        </tbody>
      </table>
      </div>
      <div>
        <button type="submit"><strong>Update</strong></button>
      </div>
    </form>
  </div>
</div>

当我对此进行网络分析时，它会发送JSON数据，但它没有指定值 - 但是，从我在控制台日志中得到的响应中我认为它只发送当前日期作为更新的唯一属性是updateTime。

这是JS，我觉得有效：

exports.UpdateSomethings = function (req, res) {
  models.Something.find({
    where: {
      id: req.params.id
    }
  }).then(function (something) {
    if (something) { // if the record exists in the db    
      something.updateAttributes({
        field1: req.body.field1,
        field2: req.body.field2,
        field3: req.body.field3
      }).then(function (somethings) {
        res.json(somethings.dataValues);
      }).catch(function (error) {
        console.log("ops: " + error);
        res.status(500).json({ error: 'error' });
      });
    }
    ;
  });
};

在控制器中：

$scope.updateSomething = function () {
  $http.post('/somethingupdate/:id', {
    field1: $scope.somethingField1,
    field2: $scope.somethingField2,
    field3: $scope.somethingField3,

  }).success(function (data, status, headers, config) {
    $scope.somethings.push({
    field1: $scope.somethingField1,
    field2: $scope.somethingField2,
    field3: $scope.somethingField3,
    });
    $scope.somethingField1 = '';
    $scope.somethingField2 = '';
    $scope.somethingField3 = '';
  }).error(function (data, status, headers, config) {
    console.log("Ops: " + data);
  });
};

以下是控制台中的结果：

Executing (default): SELECT "id", "field", "createdAt", "updatedAt" FROM  "Soemthings" AS "Something" WHERE "Something"."id" = 'id value';
Executing (default): UPDATE "Somethings" SET "field1"='' "field2" = '' "field3" = '' "updatedAt"='2016-06-09 20:20:57.384 +00:00' WHERE "id" = id value

Answer 1

尝试ng-model =“something.field1”而不是value =“{{something.field1}}”依此类推......

Answer 2

<强>已更新！

您在提交时传递空集，请检查 updateform 变量

您需要在输入中添加以 updateform

开头的ng-models

 <input class="form-control" ng-model="updateform.field1" type="number" name="field1" ng-init="updateform.field3 =something.field3">

等等。既然你说你正在使用$scope.somethingField让我们在你的标记中使用它，那么我也为id添加了一个隐藏字段。

<div class="container">
 <div ng-controller="SomethingCtrl">
<form ng-submit="updateSomething(updateform)" role="form">
  <div class="datagrid"><table>
    <thead>
    <tr>
      <th> ID </th>
      <th> field1 </th>
      <th> field2 </th>
      <th> field3 </th>
    </tr>
    </thead>
    <tbody>
    <tr ng-repeat="something in somethings | filter:{id:1} | orderBy:'id' | limitTo: 1 track by $index">
      <td>
        <input type="hidden" ng-model="updateform.id" ng-init="updateform.id = something.id">
        {{something.id}}
      </td>
      <td>
        <div class="form-group">
          <input class="form-control" ng-model="updateform.field1" type="text" ng-init="updateform.field1 = something.field1" />
        </div>
      </td>
      <td>
        <div class="form-group">
          <input class="form-control" ng-model="updateform.field2" type="text" ng-init="updateform.field2 = something.field2" />
        </div>
      </td>
      <td>
        <div class="form-group">
          <input class="form-control" ng-model="updateform.field3" type="text" ng-init="updateform.field3 =something.field3" />
        </div>
      </td>
    </tr>
    </tbody>
  </table>
  </div>
  <div>
    <button type="submit"><strong>Update</strong></button>
  </div>
</form>

然后在函数$ scope.updateSomething：

之外的控制器中

$scope.updateform = {
    field1: '',
    field2: '',
    field3: ''
}

然后在更新添加参数字段的控制器函数中，尝试检查控制台日志，如果field包含数据：

$scope.updateSomething = function (field) {
    console.log(field);
    $http.post('/somethingupdate/' + field.id, {
        field: field,
    }).success(function (data, status, headers, config) {
        $scope.somethings.push({
           field: field
        });
    }).error(function (data, status, headers, config) {
        console.log("Ops: " + data);
    });
};

这是一个有效的JSfiddle

POST方法不发送所有数据

2 个答案: