angular - 表单标签中的 ng-content

Question

我有一个带有<ng-content>标签的表单组件和 btn 目前什么都不做。我也有一个父组件，它使用简单的输入作为内容投影。

问题是，每当我单击按钮时，父组件和表单组件都会重新加载，并且页面会以初始状态刷新。

表单组件.html：

<form class="form-control">
   <div class="form-group">
     <ng-content></ng-content>
      <button type="submit">Search</button>
   </div>
</form>

父组件.html：

<app-form-component>
   <input type="text" [(ngModel)]="car.id">
</app-form-component>

我觉得我错过了内容投影的一些基本内容。

score 0 · Accepted Answer

仅供参考，问题是您已将按钮类型声明为提交

 <button type="submit">Search</button>

因此，如果您将按钮类型声明为提交，它将像这样提交表单。我也遇到过这类问题。所以只需更换，

.html 文件

  <button type="button" (click)="doLogic()">Search</button>

ts文件

doLogic(){
   //do your logics here.
}

我希望它能解决你的问题。让我们试试这个，让我知道。

谢谢，

穆图库马尔

1 回答 1