Html 为什么表单在angular 2中不发送HTTP请求？

我正在尝试从Angular 2中的表单发送HTTP请求。我有组件类、服务类和HTML页面。在HTML页面上，我有两个表单，一个用于GET请求，另一个用于Post请求。单击成功地调用了服务中相应的方法。控制台日志显示URL是正确的-URL=但是，请求没有到达服务器。

如果我使用相同的HTML文件，但没有指定请求中的URL，则成功发送请求具有相同URL的链接也适用于Angular 2和HTML文件。

因此，组件是create-policy.Component.ts

@Component({
selector: 'app-create-policy',
providers: [CreatepolicyService],
templateUrl: './create-policy.component.html',
styleUrls: ['./create-policy.component.css']
})
export class CreatePolicyComponent implements OnInit {

policy = Object.assign(new Policy, {
id: 0,
title: "",
description: ""
});

constructor(private policyService: CreatepolicyService) { }

ngOnInit() {
}
onSubmitPostHttp() {
console.log("Started onSubmitPostHttp policy=" + this.policy);
this.policyService.addPolicyWithObservable(this.policy);
}
onSubmitGetHttp() {
console.log("Started onSubmitGettHttp policy=" + this.policy);
this.policyService.getPolicyWithObservable();
}
}

HTML文件为create-policy.component.HTML：

<div class="container">
                <form #f="ngForm" (ngSubmit)="onSubmitPostHttp()">
                    <p>
                        <label>Policy Title:</label> <input type="text" name="title"
                            [(ngModel)]="policy.title" required>
                    </p>
                    <p>
                        <label>Policy Description:</label> <input type="text"
                            name="description" [(ngModel)]="policy.description">
                    </p>
                    <p>
                        <button type="submit" [disabled]="!f.valid">Submit</button>
                    </p>
                </form>
                <form #f="ngForm" (ngSubmit)="onSubmitGetHttp()">
                    <p>
                        <button type="submit" [disabled]="!f.valid">Find Policies</button>
                    </p>
                </form>
                <a href="http://localhost:8080/rentapp/policy">PolicyGet</a>
            </div>

---

您需要编写从API获取数据的服务，并将数据返回到组件，然后可以使用该数据在html中显示

有关更多信息，请参阅链接。

可观察对象是惰性的。
您需要调用

.subscribe（）

，否则什么也不会发生

this.policyService.addPolicyWithObservable(this.policy).subs‌​cribe();

---

这可能不会达到你的预期。在SPA中，表单操作会导致页面重新加载，这是非常糟糕的用户体验。相反，读取代码中的表单数据，并亲自向服务器发出HTTP请求以传递数据。@GünterZöchbauer原来的方式也不起作用。我正在更正“最初我读取代码中的表单数据，并使用HTTP对象自己向服务器发出HTTP请求，但结果是相同的，因此我显示的是最简单的代码。”最好显示此代码。您当前问题中的代码对Angular没有任何意义。@GünterZöchbauer，我更正了，请看，可观察对象是懒惰的。您需要调用

.subscribe（）

，否则什么也不会发生

this.policyService.addPolicyWithObservable（this.policy.subscribe（）谢谢。我更正了帖子，现在我展示了遵循Angular标准的原始代码——通过Http对象发送。结果是一样的
export class Policy {
public id: number;
public title: string;
public description: string;

toString(): string {
return this.title + ': ' + this.description;
}
}

this.policyService.addPolicyWithObservable(this.policy).subs‌​cribe();