Angular 每次向 json 服务器提交时，应用程序都会重新启动

Question

突然间，突然之间，没有任何修改或更新，每次我按下按钮将一些数据提交到我的应用程序的假后端数据库 (json server API) 页面重新加载。

这发生在 Chrome 和 Firefox 和 Edge.

我环顾四周，发现了一些将提交按钮类型从 type="submit" 更改为 type="button" 的建议（例如 here），但这对我不起作用，因为那时我的表单数据未提交。

有没有办法以编程方式执行此操作？最近有人遇到过这个吗？

p.s。现在，我不是 'watching' 我的 'db.json' 作为避免这个问题的解决方法，但我必须修复它才能让我的 json server API 运行...

编辑

这是我的 form 代码：

<form #postForm="ngForm" (ngSubmit)="onAnnotateSelection(postForm.value)">

        <div class="form-group">
            <textarea name="chosenTitle" rows="1" class="form-control" placeholder="Enter a title for your annotation here..."
                [(ngModel)]="chosenTitle">
            </textarea>

            <textarea name="highlightedText" id="selectedText" rows="3" class="form-control" placeholder="Your highlighted text will appear here..."
                [(ngModel)]="highlightedText" (mouseup)="mouseUp()">
            </textarea>
        </div>

        <button class="btn btn-outline-success" type="submit" [disabled]="!postForm.valid">
            Annotate your highlighted/selected Text
        </button>

        <a class="btn btn-secondary active" role="button" [href]="fileUrl" download="annotations.txt">
            Download All Annotations
        </a>

</form>

这段代码很好。我怀疑表单代码中有什么东西。我怀疑我的 package-lock.json 有什么变化，因为这个锁文件曾经在我的 gitignore 文件中，然后我了解到它实际上应该在版本控制下，所以我这样做了。它与锁定文件的更改有什么关系吗？

Answer 1

您可以停止提交表单并使用

<button
  class="btn btn-outline-success"
  type="button"
  [disabled]="!postForm.valid"
  (click)="onAnnotateSelection(postForm.value)">
  Annotate your highlighted/selected
</button>

您还应该从 form 元素中删除 ngSubmit。

Angular 每次向 json 服务器提交时，应用程序都会重新启动

Angular app restarting every time there is a submission to json server

json-server

angular