Angular 给占位符选择角度6

我有一个选择选项，我想给占位符，上面写着“选择一个类别”

类别：
选择一个类别
{{item.name}
拯救

如果我删除了[ngModel]，它就会工作。如果我写

<option value="undefined" selected>Select one category </option>    

选择一个类别

---

然后将其视为一个值。我必须确保有一个地方，还需要选择一个模板驱动的角度形式的值

之一，您可能需要考虑这一点。 你可以找到代码

对于一个简单的html表单，这里有一个代码片段。

选择一个值
选择1
选择2

您可以使用

[value]=“所选隐藏”

我已经在

类别：
选择一个类别
{{item.name}
拯救

如果您希望在

类别

仍为

未定义

时选择第一个值，可以使用

ngValue

将值

未定义

分配给第一个选项：

<option [ngValue]="undefined" hidden>Select one category</option>

选择一个类别

只需使用

[value]=“undefined”

选择。。。
{{c}}

由于您使用的是ngModel，默认情况下，要选择选项标签的值属性和组件类中的初始类别值必须相同。要使其隐藏在列表中，可以使用hidden属性。为了验证问题的一致性，最好的方法是使用ngValue而不是value

在组件中：

category: string = null;

在模板中：

<option [ngValue]="null" hidden>Select one category </option>

选择一个类别

这对我很有效。我使用了第一个选项值作为占位符

示例选择
{{placeholder.select}
房子
平的
城镇住宅

尝试下面给出的代码，您必须将模板变量添加到代码中并将其指定为值，然后它才能工作

<select class="custom-select d-block w-100" id="Category" [(ngModel)]="Category" name="Category" #category="ngModel" required>
                    <option value="category" disabled hidden>Select one category </option>                                     
                     <option *ngFor="let item of myBusinessList" [value]="item.id">{{item.name}}</option>
                </select>

选择一个类别
{{item.name}

这不是使选项禁用的正确方法，它仍然是一个选项。当她询问占位符时，它不带[（ngModel）]=“Category”，不带[（ngModel）]你没有提到名称标签，ngModel不带名称标签就不能工作。如果你提到名字标签，你的代码就不会像现在这样工作了。我刚刚做了一个更新，它的工作如预期。请检查。我不知道它对你有什么作用，但对我没有作用。你想做什么？你添加了css吗？可能是

Category

在@RuchitaAjmera的代码中没有初始化为空字符串吗？@ConnorsFan它工作得很有魅力。它没有初始化，这就是它不工作的原因。谢谢我希望当下拉显示时，用户应该知道他们必须选择类别，如果没有类别，他们不应该继续。您提供的解决方案将允许用户继续，因为它被视为未定义value@RuchitaAjmera-编号。

类别

已未定义。将该值作为选项不会更改任何内容（允许文本显示在选择框中除外）。当值未定义时，由您决定将发生什么。它允许我使用“选择一个类别”选项提交表单。但情况是，用户应该选择其中一个选项，然后只有他可以提交。哦，是的，你是对的。当值为空字符串时，

required

属性起作用，但对于

[ngValue]=“undefined”

则不起作用。

<option [ngValue]="null" hidden>Select one category </option>

<select class="custom-select d-block w-100" id="Category" [(ngModel)]="Category" name="Category" #category="ngModel" required>
                    <option value="category" disabled hidden>Select one category </option>                                     
                     <option *ngFor="let item of myBusinessList" [value]="item.id">{{item.name}}</option>
                </select>