我已经从 Web 创建了基于应用程序的示例:Angular 中的前端和 Spring Boot 的后端(mer 客户) Angular URL:http://localhost:4200/ Spring Boot URL:http://localhost:9020/(REST:http:// /本地主机:9020/api/ )
<h1>Angular Part </h1>
`export class Customer {
id: number;
firstname: number;
lastname: Number;
age: number;
active: boolean;}`
和
import { Customer } from './customer';
export class CustomerService {
private baseUrl = http://localhost:9020/api';
constructor(private http: HttpClient) { }
getCustomer(id: number): Observable<Object> {
return this.http.get(${this.baseUrl}+`/customers`+/${id});}
createCustomer(customer: Customer): Observable<Object> {
console.log("customer.lastname: "+customer.lastname);
console.log("customer.firstname: "+customer.firstname);
return this.http.post(${this.baseUrl} + `/create`, customer);
}
getCustomersList(): Observable<any> {
return this.http.get(${this.baseUrl}+`/customers`);
}
}
import { Component, OnInit } from '@angular/core';
import { Customer } from '../customer';
import { CustomerService } from '../customer.service';`
@Component({
selector: 'create-customer',
templateUrl: './create-customer.component.html',
styleUrls: ['./create-customer.component.css']
})
export class CreateCustomerComponent implements OnInit {
customer: Customer = new Customer();
submitted = false;
constructor(private customerService: CustomerService) { }
ngOnInit() {
}
newCustomer(): void {
this.submitted = false;
this.customer = new Customer();
}
save() {
this.customerService.createCustomer(this.customer)
.subscribe(data => {console.log(data);
this.submitted = true;},error => console.log(error));
this.customer = new Customer();}
onSubmit() {
this.save();}}
牧羊人nacy
相关分类