angular / angular/components

Feature: Possibility to make the [displayWith] of Autocomplete more flexible

未关闭
#4,863 31 条评论 43 个 reaction 已指派 0 人 在 GitHub 查看
area: material/autocomplete feature needs: discussion P3
主要语言
TypeScript
星标
25k
派生
6.8k
平均合并
1 天 8 小时
30 天内合并 PR
91

描述

#### Bug, feature request, or proposal:
Feature Request.

#### What is the expected behavior?
I expect `[displayWith]` to give me back the whole `object` so I can treat what property I can return to `display` (doesn't it make sense)?

#### What is the current behavior?
Actually `[displayWith]` is too limited.

Ex:

I have the following variable that gets the content from API:

```
this.myObs = this..();
```

That's the content coming from back-end:

```
[
{ id: 1, name: 'anyName' },
{ id: 2, name: 'xxx' }
];
```

In template I have:

```


{{ obj.name }}

```
Since, I'm binding the md-option to `id`, `[displayWith]` just gives me the value of `id` while I was expecting at least the `full object` so I can return the `name`, for example.

**Workarounds:**

1- Subscribe to the observables and store in arrays.

**Problem 1:** You'll have to loop through the array **everytime** that an option is selected to return the desired property.

**Problem 2:** Imagine that I have more than 10 autocomplete (my case), I'll have to create 10 variables and subscribe them all while I could simply use the `async` pipe (as I'm doing) and, consequently I wouldn't need to subscribe in nothing.

2 - Bind the full object to ``, so `[displayWith]` will give me back the whole object.

**Problem:** If your API expects a single property (in my case back-end expects only the id), before submits the form, you'll have to change **the whole** content of form that was stored as object to id.

#### What are the steps to reproduce?

Providing a Plunker (or similar) is the *best* way to get the team to see your issue.
Plunker template: https://goo.gl/DlHd6U

#### What is the use-case or motivation for changing an existing behavior?
-

#### Which versions of Angular, Material, OS, TypeScript, browsers are affected?
Material 2.0.0-beta.6

#### Is there anything else we should know?
The workarounds can be used? Ofc they can, however it'd be really better if Material2 could provide a better solution for this.

贡献指南

打开贡献指南

调研方向

首先检查 Angular Material 中与 displayWith 和 md-option 值相关的自动完成行为。使用异步选项列表、一个值为 id 的选项以及一个显示函数重现该示例。当所请求的对象感知显示行为已定义并经过验证,且无需手动订阅或在提交前替换表单值时,即表示完成。

由索引模型根据 Issue 内容生成。

评估

技术栈
angular, typescript
领域
frontend
Issue 类型
功能
难度
4/5
预计耗时
3-5 天
活跃度
停滞
描述清晰度
基本清楚
新手友好度
28/100

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。