英文:
Typescript error TS2345: Argument of type 'number' is not assignable to parameter of type 'never'
问题
以下是代码部分的中文翻译:
> src/app/is-disabled/is-disabled.component.ts:26:89 - error TS2345: 类型为 'number' 的参数无法分配给类型为 'never' 的参数。
>
> 26 ([allowDenyListed, denyList, selected]) => !allowDenyListed && denyList!.includes(selected),
带有错误的 TypeScript 代码如下:
import { Component } from '@angular/core';
import { FormControl } from '@angular/forms';
import { combineLatest, map, startWith } from 'rxjs';
@Component({
selector: 'app-is-disabled',
templateUrl: './is-disabled.component.html',
styleUrls: ['./is-disabled.component.css']
})
export class IsDisabledComponent {
users = [
{ name: 'Peter', id: 1 },
{ name: 'Paul', id: 2 },
{ name: 'Mary', id: 3 },
];
denyListedUsers = new FormControl([]);
selectedUserId = new FormControl(null);
allowDenyListedUsers = new FormControl(false);
isDisabled$ = combineLatest([
this.allowDenyListedUsers.valueChanges.pipe(startWith(false)),
this.denyListedUsers.valueChanges.pipe(startWith([])),
this.selectedUserId.valueChanges.pipe(startWith(null), map(id => +id!)),
]).pipe(
map(
([allowDenyListed, denyList, selected]) => !allowDenyListed && denyList!.includes(selected),
),
)
}
Angular 版本为 15.0.0。
英文:
The following Angular Typescript code has an error:
> src/app/is-disabled/is-disabled.component.ts:26:89 - error TS2345: Argument of type 'number' is not assignable to parameter of type 'never'.
>
> 26 ([allowDenyListed, denyList, selected]) => !allowDenyListed && denyList!.includes(selected),
I am learning Angular, Typescript and Rxjs.
I think I need to declare the proper type for line 26. I tried but still, get the same error.
How to fix it?
is-disabled.component.html:
<select [formControl]="selectedUserId">
<option>Select a User</option>
<option *ngFor="let user of users" [value]="user.id">{{ user.name }}</option>
</select>
<select [formControl]="denyListedUsers" multiple>
<option *ngFor="let user of users" [value]="user.id">{{ user.name }}</option>
</select>
Allow deny listed users <input type="checkbox" [formControl]="allowDenyListedUsers" />
<button [disabled]="isDisabled$ | async">Submit</button>
is-disabled.component.ts:
import { Component } from '@angular/core';
import { FormControl } from '@angular/forms';
import { combineLatest, map, startWith } from 'rxjs';
@Component({
selector: 'app-is-disabled',
templateUrl: './is-disabled.component.html',
styleUrls: ['./is-disabled.component.css']
})
export class IsDisabledComponent {
users = [
{name: 'Peter', id: 1},
{name: 'Paul', id: 2},
{name: 'Mary', id: 3},
];
denyListedUsers = new FormControl([]);
selectedUserId = new FormControl(null);
allowDenyListedUsers = new FormControl(false);
isDisabled$ = combineLatest([
this.allowDenyListedUsers.valueChanges.pipe(startWith(false)),
this.denyListedUsers.valueChanges.pipe(startWith([])),
this.selectedUserId.valueChanges.pipe(startWith(null), map(id => +id!)),
]).pipe(
map(
([allowDenyListed, denyList, selected]) => !allowDenyListed && denyList!.includes(selected),
),
)
}
The Angular version is 15.0.0.
答案1
得分: 2
- 使用强类型的 FormControl。
denyListedUsers = new FormControl<number[]>([] as number[]);
- 接下来,您必须将空数组
[]
定义为number[]
类型。
this.denyListedUsers.valueChanges.pipe(startWith([] as number[]))
或者,不使用 startWith
rxjs 运算符也可以正常工作。
this.denyListedUsers.valueChanges.pipe()
英文:
- Use strong-typed FormControl.
denyListedUsers = new FormControl<number[]>([] as number[]);
- Next, you have to define empty array
[]
asnumber[]
type.
this.denyListedUsers.valueChanges.pipe(startWith([] as number[]))
Or without startWith
rxjs operator could be worked as well.
this.denyListedUsers.valueChanges.pipe()
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论