我正在学习Angular,它将创建一个可以管理客户的表单。我创建了一个customer-form-component
:
export class CustomerFormComponent implements OnInit {
customer: Customer = CustomerCreate.empty();
customerForm: FormGroup;
countries: Country[];
references: Reference[];
constructor(
private fb: FormBuilder,
private cs: CustomerService) { }
ngOnInit() {
...
this.cs.getSingleForForm(id)
.subscribe(customer => {
this.customer = customer[0];
this.initCustomer();
});
}
});
});
this.initCustomer();
}
...
在该表格中,有两个选择(国家和参考)。为了减少请求,我想以JSON格式在一个HTTP请求(客户,国家/地区,参考)中传递所有数据。到目前为止,这是我的工作服务:
export class CustomerService {
private api = 'http://127.0.0.1/index.php';
constructor(private http: HttpClient) {}
getSingle(id: number): Observable<Customer> {
return this.http
.get<CustomerRaw[]>(`${this.api}?customer&id=${id}`)
.pipe(
retry(2),
map(rawCustomers => rawCustomers['customer']
.map(rawCustomer => CustomerCreate.fromObject(rawCustomer))
),
catchError(this.handleError)
);
}
...
}
是否可以执行map
三次并返回三个对象(客户,国家/地区,参考[])的可观察对象?像这样:
getSingleForForm(id: number): Observable<Object> {
return this.http
.get<any>(`${this.api}?customer&kdnr=${id}`)
.pipe(
retry(2),
map(rawCustomers => rawCustomers['customer']
.map(rawCustomer => CustomerCreate.fromObject(rawCustomer))
),
map(rawCountries => rawCountries['country']
.map(rawCountry => CountryCreate.fromObject(rawCountry))
),
map(rawReferences => rawReferences['reference']
.map(rawReference => ReferenceCreate.fromObject(rawReference))
),
catchError(this.handleError)
);
}
我的创建类如下:
export class CountryCreate {
static fromObject(rawCountry: CountryRaw| any): Country {
return new Country(
rawCountry.id,
rawCountry.iso2,
rawCountry.name,
rawCountry.active,
);
}
static empty(): Country {
return new Country(0, '', '', true);
}
}
正常班级:
export class Country {
constructor(
public id: number,
public iso2: string,
public name: string,
public active: boolean
) {}
}
我的原始类如下:
export class CountryRaw {
country: {
id: number,
iso2: string,
name: string,
active: boolean,
} [];
}
JSON的结构为:
{
"customer":[{...}],
"country":[{...}],
"reference":[{...}]
}
还有没有办法减少每个实体(例如,Customer,CustomerRaw,CustomerCreate)的类数量?
答案 0 :(得分:1)
您不必执行map
3次即可获得所需的输出。使用pipe
时,运算符的输入是先前运算符的输出。当您有3次地图时,它会像这样
sourceData
.map(return sourceDataX) <-- the input here is the sourceData
.map(return sourceDataY) <-- the input here is the sourceDataX
.map(return sourceDataZ) <-- the input here is the sourceDataY
在您的示例中,您可以使用一个map
运算符
getSingleForForm(id: number): Observable<Object> {
return this.http
.get<any>(`${this.api}?customer&kdnr=${id}`)
.pipe(
retry(2),
map(data => {
const costomer = data['customer'].map(rawCustomer => CustomerCreate.fromObject(rawCustomer));
const country = data['country'].map(rawCountry => CountryCreate.fromObject(rawCountry));
const reference = rawReferences['reference'].map(rawReference => ReferenceCreate.fromObject(rawReference))
return {
customers,
country,
reference
}
}
),
catchError(this.handleError)
);
}
有没有一种方法可以减少每个实体的类数量
您可以使用any
并避免使用类型。但是,请勿这样做!您应该始终使用类,因为这将有助于您的开发。正确无误。
我还要再添加一个类,并将Observable<Object>
替换为Observable<MyType>