极客观点
项目管理
HarmonyOS
我目前正在做一个项目，我需要用户填写一个角度表单，然后将其发送到我后端的路由来处理数据。后端在 ASP.NET 中，我已经有一个可用的 HTML 函数形式：
<body>
<h2 style="text-align:center">Push notification test</h2>
<form style="align-content:center" action="SendPushNotification" method="post">
<div>
<fieldset>
<legend> Informations </legend>
<label> Notification name : </label>
<input name="notificationName" id="notificationName" type="text" value="Bonjour" />
</fieldset>
<br />
<fieldset>
<label> Server Key : </label>
<input name="serverKey" id="serverKey" type="text" value="AAAAuTv1XVQ:APA91bHsgOmK-quki_rRehRhON9c_y9INocubgru6_jPePiE_Zt5iVXfJ-XD43RubfIY5WEoIpFEyziByfeNRsoIlpeNi693bGZYfjjb7ULDx23sRzHQcYLCgl7y3vn-K9X8hrmQhw1oY6lSTml2aqzoi8GGBIeZYA" />
</fieldset>
<br />
<fieldset>
<label> To mobile user : </label>
<select name="selectMobile" id="selectMobile" style="width:400px" name="mobileUser">
<option>Select Mobile User</option>
</select>
</fieldset>
<br />
<fieldset>
<label> To topic : </label>
<input name="topicName" id="topicName" type="text" value="news" />
</fieldset>
<br />
<fieldset>
<label> Message : </label>
<textarea name="notificationMessage" id="notificationMessage" cols="40" rows="5">Comment tu vas toi ?</textarea>
</fieldset>
<br />
<input type="submit" value="Send Notification" />
</div>
</form>
渲染
所以我试图在 Angular 6 中用这个结果做同样的事情，但是当我想将路由“SendNotification”分配给我的“提交”按钮时，我收到以下错误：
角度渲染 + 错误
通知表单.component.html
<button [routerLink]="['SendNotification']" type="submit" class="btn btn-success" [disabled]="!notificationForm.form.valid">Submit</button>
一旦我添加 [routerLink] 或添加私有构造函数，就会发生错误：
constructor(private router: Router) {}
到我的 notification-form.component.ts 。我已经尝试了几种解决方案，例如将 HttpClientModule 添加到我的 app.module.ts 但没有任何效果。
我做错了什么吗？
预先感谢您的宝贵时间！
更新：
应用程序模块.ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms'; // <-- NgModel lives here
import { RouterModule } from '@angular/router';
import { HttpClientModule } from '@angular/common/http';
import { AppComponent } from './app.component';
import { NotificationFormComponent } from './notification-form/notification-form.component';
@NgModule({
imports: [
BrowserModule,
HttpClientModule,
FormsModule,
RouterModule
],
declarations: [
AppComponent,
NotificationFormComponent
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
原文由 Fenouille 发布，翻译遵循 CC BY-SA 4.0 许可协议
首先导入
RouteModule在app.module.ts并像下面这样使用它：（您只导入
RouterModule但还需要添加forRoot([])。）如果您有任何路线，请像下面那样使用它们。来自 Angular DOC 的示例代码
在你的主要组件（
app.component.html）中添加<router-outlet></router-outlet>希望对你有帮助！