1

Angular JS 1.4.1 プロトタイプにフォームがあります。汚れたときにクラスを設定しています。フォームを「保存」する人をシミュレートしようとしているため、フォームは汚れていません。「保存」されているため、変更はまだ存在しますが、汚れていません。

フォームフラグメント:

<div class="override">
  <tabset>
    <tab heading="My Tab">
      <form name="overridesForm">
        <p><input ng-model="rd.isOverriden" type="checkbox"> Foobar</p>
        <div class="buttons save-cancel">
          <button class="btn btn-default btn-xs" ng-click="overridesForm.reset();overridesForm.$setPristine()">Cancel</button>
          <button class="btn btn-primary btn-xs" ng-click="overridesForm.$setPristine()">Save with Inline</button>
          <button class="btn btn-primary btn-xs" ng-click="saveData()">Save with Inline</button>
        </div>
      </form>
    </tab>
    <tab heading="Some other Tab">
      blah
    </tab>
  </tabset>
</div>

フォームを元の状態に設定すると、コントローラーの関数ではなく、インラインでのみ機能します。したがって、これは機能します：

<button ng-click="overridesForm.$setPristine()">Save</button>

しかし、これではありません：

<button ng-click="saveData()">Save</button>

//controller:
$scope.saveData = function () {
    $scope.overridesForm.$setPristine();
    toastr.success('Success', 'Data was saved.');
  };

「no object overridesForm defined」という実行時エラーが発生します。

理由はまだわかりませんが、このコードペンでは機能しますが、私のプロジェクトでは機能しません。

アップデート：

トランクルードされたコンテンツのフォームへのアクセスについて検索した後、私はこれに出くわしました:

 <button ng-click="saveData(overridesForm)">Save with Inline</button>

これをコントローラーに割り当てます：

  $scope.saveData = function(form) {
    $scope.overridesForm = form;
    $scope.overridesForm.$setPristine();
  };

これがベストプラクティスかどうかはわかりませんが、うまくいきます。コードペンを更新しました。

4

0 に答える 0