当使用 Angular Material 的自动补全功能(Mat-Autocomplete)时,对于从选定项中选择的对象,如果要将其作为完整对象发送到后端,可能会面临发送整个对象的问题。这可能会导致性能问题,因为用户只需要选择对象的一个或几个属性,不需要将整个对象都发送到后端。
解决此问题的一种方法是定义一个接口,该接口只包含需要发送到服务器的对象属性。然后,在自动完成期间选择要发送的属性,而不是整个对象。最后,使用自己定义的接口来创建新的对象并发送到服务器。
以下是一个示例解决方案,假设选择的对象包含名称和 ID 属性,并且只想将名称属性发送到后端:
interface SelectedOption { name: string; }
selectedOption: SelectedOption; options: any[] = [{'id':1, 'name':'One'}, {'id':2, 'name':'Two'}, {'id':3, 'name':'Three'}];
let body = { name: this.selectedOption.name };
this.http.post('https://example.com/api', body).subscribe(response => { console.log(response); });