0

我正在尝试在我的角度项目中制作一些自定义搜索过滤器,它工作正常,但在我的 vscode 中出现错误。在我之前的项目中,更新我的 cli 后它工作正常,但出现这样的错误。我该如何解决这个错误?

提前致谢

类型 'unknown' 不可分配给类型 'any[] & Iterable'

错误

我使用角度 11。

<section *ngIf="!spinner; else showspinner">
  <div class="w-100 px-5">
    <div class="p-3">
      <label>Email</label>
      <input
        type="text"
        name="email"
        placeholder="Search By Email"
        class="form-control"
        id=""
        [(ngModel)]="searchText"
      />
    </div>
  </div>

  <div class="table-responsive">
    <table class="table table-hover table-bordered table-striped">
      <thead>
        <tr>
          <th>Name</th>
          <th>Email</th>
          <th>Phone</th>
          <th>Enrolment-Id</th>
          <th>Course</th>
          <th>Python/Sql</th>
          <th>Statistics</th>
          <th>ML</th>
          <th>Mid-Term Objective</th>
          <th>Mid-Term Subjective</th>
          <th>Final Assessment</th>
          <th>Project Ability</th>
          <th>Internship Ability</th>
          <th>Live Session Attendance</th>
          <th>Internship Attendance</th>
          <th><a> view </a></th>
          <th><a> Downlode </a></th>
        </tr>
      </thead>
      <tbody>
        <tr *ngFor="let item of response | email: searchText">
          <td>{{ item.name }}</td>
          <td>{{ item.email }}</td>
          <td>{{ item.phone }}</td>
          <td>{{ item.enrolmentid }}</td>
          <td>{{ item.course }}</td>
          <td>{{ item.pythonsql }}</td>
          <td>{{ item.statistics }}</td>
          <td>{{ item.ml }}</td>
          <td>{{ item.midtermobj }}</td>
          <td>{{ item.midtermsubj }}</td>
          <td>{{ item.finalassessment }}</td>
          <td>{{ item.projectability }}</td>
          <td>{{ item.internshipability }}</td>
          <td>{{ item.livesessionattendance }}</td>
          <td>{{ item.internshipattendance }}</td>
          <td>
            <a
              [routerLink]="['../details', item._id]"
              routerLinkActive="router-link-active"
            >
              <span class="badge badge-success">view</span>
            </a>
          </td>

          <td>
            <a href="javascript:void(0)" (click)="downlode(item._id)"
              ><span class="badge badge-danger">Downlode</span></a
            >
          </td>
        </tr>
      </tbody>
    </table>
  </div>
</section>
<ng-template #showspinner>
  <app-spinner></app-spinner>
</ng-template>

组件.ts

 response: any;
  searchText: any;
  spinner: boolean = false;

  record() {
    this.spinner = true;
    this.get_data_service.get_record().subscribe((res: any) => {
      if (res.err) {
        console.log(res.message);
        this.spinner = false;
      } else {
        this.response = res.data;
        this.spinner = false;
      }
      console.log(res);
    });

管道.ts

@Pipe({
  name: 'email',
})
export class EmailPipe implements PipeTransform {
  transform(item: any, searchValue?: string): unknown {
    // console.log('pipe');
    if (searchValue === undefined) {
      return item;
    }
    return item.filter((i: any) => {
      let data = i.email
        .replace(/\s+/g, '')
        .toLowerCase()
        .includes(searchValue.toLocaleLowerCase().replace(/\s+/g, ''))
        ? i
        : '';
      return data;
    });
  }

包.json

 "dependencies": {
    "@angular/animations": "~11.0.6",
    "@angular/common": "~11.0.6",
    "@angular/compiler": "~11.0.6",
    "@angular/core": "~11.0.6",
    "@angular/forms": "~11.0.6",
    "@angular/platform-browser": "~11.0.6",
    "@angular/platform-browser-dynamic": "~11.0.6",
    "@angular/router": "~11.0.6",
    "bootstrap": "^4.5.3",
    "file-saver": "^2.0.5",
    "jquery": "^3.5.1",
    "rxjs": "~6.6.0",
    "tslib": "^2.0.0",
    "zone.js": "~0.10.2"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.1100.6",
    "@angular/cli": "~11.0.6",
    "@angular/compiler-cli": "~11.0.6",
    "@types/file-saver": "^2.0.1",
    "@types/jasmine": "~3.6.0",
    "@types/node": "^12.11.1",
    "codelyzer": "^6.0.0",
    "jasmine-core": "~3.6.0",
    "jasmine-spec-reporter": "~5.0.0",
    "karma": "~5.1.0",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage": "~2.0.3",
    "karma-jasmine": "~4.0.0",
    "karma-jasmine-html-reporter": "^1.5.0",
    "protractor": "~7.0.0",
    "ts-node": "~8.3.0",
    "tslint": "~6.1.0",
    "typescript": "~4.0.2"
  }
4

2 回答 2

3

我不知道,angular但是typescript当您将返回类型添加到函数中时,您应该知道返回类型(实际上您将返回限制为这些类型),如果您不知道,请typescript创建该类型。

只需尝试删除类型unknown

transform(item: any, searchValue?: string): unknown {

transform(item: any, searchValue?: string) {
于 2021-01-18T15:56:44.060 回答
0

在你的管道中transform function has unknown type

改变unknown to any[]你的问题就解决了:)

在此处输入图像描述

于 2022-03-02T17:58:09.127 回答