Question

我想在Angular 4中禁用<View pointerEvents="none"> <WebView source={{ uri: webviewUrl }} scrollEnabled={false} /> </View>。我编写了如下代码，但select未被禁用。

在组件中：

select

在HTML中：

import { FormBuilder, Validators, FormGroup } from '@angular/forms';    

this.eventForm = this.formBuilder.group({
    // ... some codes ...
    'state': [true, Validators.required],
    'stepStrengh': [10, Validators.nullValidator]
});

当我将<input type="radio" formControlName="state" [value]="true"/> Enable Step <input type="radio" formControlName="state" [value]="false"/> Disable Step <select formControlName="stepStrengh" [disabled]="!eventForm.get('timeslots').value"> <option [ngValue]="10">10 steps</option> <option [ngValue]="15">15 steps</option> </select>添加到[disabled]="true"标记中时，该选项标记已停用，但我想禁用option标记本身。

我试过这样 -

select

但是当我从<select formControlName="stepStrengh" disabled="{{state ? '': 'disabled'}}">或true->false

更改状态变量时，这也无效

Answer 1

在阅读了一些文档和其他内容后，我发现这个approcah正在为我工作

<select [attr.disabled]="state ? '' : null" formControlName="stepStrengh" >

希望它有所帮助。

Here is a link to stackblitz

Answer 2

您采用模板驱动方式与反应式方式混合。选择一种方法是最好的。在这种情况下，在你的打字稿中执行：control.disable（）

特别为了您的目的，它将是：

this.eventForm.get（＆＃39; stepStrengh＆＃39）。禁用（）;

请注意，您将在初始表单设置之后设置此项。

Angular 4 select disabled无效

2 个答案: