是否有angularjs形式的属性仅可获取更改的值?

时间:2019-05-07 22:51:50

标签: angularjs

我正在尝试仅以Angular Js形式提交用户修改的数据。我们如何在Angular Js中做到这一点? (版本:1.4.14)。

我遇到了表格的属性$$success.parse。但是在Angular Js网站上没有有关此属性的详细信息。我们可以使用此属性吗?任何帮助表示赞赏。

1 个答案:

答案 0 :(得分:0)

如评论中所述,您要检查每个表单元素的$dirty属性。 在此处查看示例https://next.plnkr.co/edit/YW7ad8vYjfE9jnLW?preview

HTML

<body ng-controller="MainCtrl" ng-cloak>
  <form name="userForm">
    <div>
      Name:
        <input
          name="name"
          type="text"
          ng-model="user.name"
          ng-change="getChanges(userForm)">
      Age:
        <input
          name="age"
          type="number"
          ng-model="user.age"
          ng-change="getChanges(userForm)">
      Gender: 
        <select
          name="gender"
          ng-model="user.gender"
          ng-change="getChanges(userForm)">
            <option value="M">M</option>
            <option value="F">F</option>
            <option value="O">Other</option>
        </select>
    </div>
    <div>
      <button
        name="reset"
        type="button"
        ng-click="setPristine(userForm)">Set pristine
      </button>
    </div>
  </form>
  <div>
    User changed values: {{ changedValues | json }}
  </div>
</body>

JavaScript

angular.module('app', []).controller('MainCtrl', function($scope, $timeout) {
  angular.extend($scope, {
    user: {
      name: null,
      age: null,
      gender: null
    },
    changedValues: {},
    getChanges: function(form) {
      $scope.changedValues = {};
      angular.forEach(form, function(value, key) {
        if (!key.startsWith('$')) {
          if (value.$dirty) {
            $scope.changedValues[key] = value.$modelValue;
          }
        }
      });
    },
    setPristine: function(form) {
      form.$setPristine();
      $scope.getChanges(form);
    }
  });

  $timeout($scope.reset);
});

img