AngularCli人
由于某些原因,我向mockApi添加新对象/输入的帖子不起作用,至少我的Api保持不变。 我的代码有什么问题或为什么它不起作用?
如果需要进一步的详细信息,请告诉我。
添加到api.component.html
Can't locate object method "name" via package "P1" at ./p.pl line 8.

接下来是add-to-api.component.ts,这个组件是通过router-outlet / routerLink的另一个组件的一部分,因此有更多的导入,而不是在这个.ts < / p>
{{diagnostic}}
<div class="container">
<h1>Add to Api</h1>
<form (ngSubmit)="addToApi(devicemgForm.value)" #devicemgForm="ngForm">
<div class="form-group">
<label for="hitInfo">HitInfo</label>
<!-- HitInfo är Name i guiden -->
<input type="text" class="form-control" id="hitInfo" required [(ngModel)]="model.HitInfo" name="hitInfo" #hitInfo="ngModel">
<div [hidden]="hitInfo.valid || hitInfo.pristine" class="alert alert-danger">Fältet måste fyllas i</div>
</div>
<div class="form-group">
<label for="repairStatus">RepairStatus</label>
<!-- RepairStatus är Alter Ego i guiden -->
<input type="text" class="form-control" id="repairStatus" required [(ngModel)]="model.RepairStatus" name="repairStatus" #repairStatus="ngModel">
<div [hidden]="repairStatus.valid || repairStatus.pristine" class="alert alert-danger">Fältet måste fyllas i</div>
</div>
<div class="form-group">
<label for="reported">Reported</label>
<!-- Reported är powers i guiden -->
<select class="form-control" id="reported" required [(ngModel)]="model.Reported" name="reported">
<option *ngFor="let rep of reported" [value]="rep">{{rep}}</option>
</select>
</div>
<!-- <button type="submit" class="btn btn-success" [disabled]="!devicemgForm.form.valid">Submit</button> -->
<button type="submit" class="btn btn-success" [disabled]="!devicemgForm.valid">Submit</button>
<button type="button" class="btn btn-default" (click)="devicemgForm.reset()"
>Rensa formulär</button>
</form>
</div>
&#13;
我使用的服务类是get-api.sevice.ts
import { Component, OnInit } from '@angular/core';
import { NgForm } from '@angular/forms';
import { HttpClient } from '@angular/common/http';
import {Devicemg} from '../devicemg';
import { GetApiService } from '../get-api.service';
@Component({
selector: 'app-add-to-api',
templateUrl: './add-to-api.component.html',
styleUrls: ['./add-to-api.component.css']
})
export class AddToApiComponent implements OnInit {
kurtan = [];
reported = ['true', 'false'];
model = new Devicemg ();
get diagnostic() { return JSON.stringify(this.model); }
constructor(private _getApiService: GetApiService) { }
ngOnInit() {
}
addToApi(devicemg: Devicemg) {
this._getApiService.addApi(devicemg).subscribe();
}
}
&#13;
app模块
import { Injectable } from '@angular/core';
import { Devicemg } from './devicemg';
import { HttpClient, HttpErrorResponse, HttpResponse, HttpHeaders } from '@angular/common/http';
import { map } from 'rxjs/operators';
import { Observable } from 'rxjs/Observable';
import { NgForm } from '@angular/forms';
const httpOptions = {
headers: new HttpHeaders({
'Content-Type': 'application/json',
// 'Authorization': 'my-auth-token'
})
};
@Injectable()
export class GetApiService {
// private mainmenuUrl = 'https://logmanagementtool.azurewebsites.net/api/loganalysis/getall';
private jMockApi = 'http://demo8609839.mockable.io/johansmockapi';
constructor(private httpClient: HttpClient) { }
public getApi(): Observable<any> {
return this.httpClient.get(this.jMockApi)
.pipe(map((response: Response) => response));
} // ska inte ha .json() på slutet då detta görs automatiskt nuförtiden på Response i angular
public deleteIdFromApi (id: number): Observable<{}> {
const url = this.jMockApi + '/' + id;
return this.httpClient.delete(this.jMockApi, httpOptions).pipe(map((response: Response) => response));
}
public addApi (devicemg: Devicemg): Observable<any> {
return this.httpClient.post<Devicemg>(this.jMockApi, devicemg, httpOptions);
}
}
&#13;
帮助理解为什么它不会改变我的api:http://demo8609839.mockable.io/johansmockapi
由于