TS2345 и TS2322 в Typescript при инициализации - PullRequest
0 голосов
/ 21 марта 2020

У меня ошибка с инициализацией переменных и объектов.

Я не Angular и эксперт по внешнему интерфейсу, поэтому у меня возникла проблема с этой ошибкой.

В методе loadDetail Файл TypeScript У меня эта ошибка произошла в строке 49: findByIdDemande (this.demande.id):

TS2345: Аргумент типа 'число | undefined 'нельзя назначить параметру типа' number '.

И эта ошибка возникала в строке 50 this.detailDemandes = res.body всегда в функции loadDetail.

TS2322: Тип' IDetailDemande [] | null 'нельзя назначить типу' IDetailDemande [] '.

модель Demande

import { Moment } from 'moment';
import { IDetailDemande } from 'app/shared/model/detail-demande.model';

export interface IDemande {
  id?: number;
  pose?: boolean;
  reference?: string;
}

export class Demande implements IDemande {
  constructor(
    public id?: number,
    public reference?: string,
    public detailDemandes?: IDetailDemande[]
  ) {
    this.pose = this.pose || false;
  }
}

модель detail-demande

export interface IDetailDemande {
  id?: number;
  name?: string;
}

export class DetailDemande implements IDetailDemande {
  constructor(
    public id?: number,
    public name?: string,
  ) {}
}

demande-update.component.ts

import { Component, OnInit } from '@angular/core';
import { HttpResponse } from '@angular/common/http';
// eslint-disable-next-line @typescript-eslint/no-unused-vars
import { FormBuilder, Validators } from '@angular/forms';
import {ActivatedRoute, Router, Routes} from '@angular/router';
import {EMPTY, Observable} from 'rxjs';

import { IDemande, Demande } from 'app/shared/model/demande.model';
import { DemandeService } from './demande.service';
import {IDetailDemande} from "app/shared/model/detail-demande.model";
import {DetailDemandeService} from "app/entities/detail-demande/detail-demande.service";

@Component({
  selector: 'jhi-demande-update',
  templateUrl: './demande-update.component.html'
})
export class DemandeUpdateComponent implements OnInit {
  isSaving = false;
  demande: IDemande;
  detailDemandes: IDetailDemande[];

  editForm = this.fb.group({
    id: [],
    pose: [],
    referenceKapps: []
  });

  constructor(
    protected demandeService: DemandeService,
    protected detailDemandeService: DetailDemandeService,
    protected activatedRoute: ActivatedRoute,
    protected router: Router,
    private fb: FormBuilder
  ) {
    this.demande = new Demande();
    this.detailDemandes = [];
  }

  ngOnInit(): void {
    this.activatedRoute.data.subscribe(({ demande }) => {
      this.demande = demande;
      this.updateForm(demande);
    });

    this.loadDetail();
  }

  loadDetail() {
    this.detailDemandeService.findByIdDemande(this.demande.id).subscribe((res: HttpResponse<IDetailDemande[]>) => {
      this.detailDemandes = res.body;
    });
  }

  updateForm(demande: IDemande): void {
    this.editForm.patchValue({
      id: demande.id,
      pose: demande.pose,
      reference: demande.reference
    });
  }

  previousState(): void {
    window.history.back();
  }

  save(): void {
    this.isSaving = true;
    const demande = this.createFromForm();
    if (demande.id !== undefined) {
      this.subscribeToSaveResponse(this.demandeService.update(demande));
    } else {
      this.subscribeToSaveResponse(this.demandeService.create(demande));
    }
  }

  private createFromForm(): IDemande {
    return {
      ...new Demande(),
      id: this.editForm.get(['id'])!.value,
      pose: this.editForm.get(['pose'])!.value,
      reference: this.editForm.get(['reference'])!.value
    };
  }

  protected subscribeToSaveResponse(result: Observable<HttpResponse<IDemande>>): void {
    result.subscribe(
      () => this.onSaveSuccess(),
      () => this.onSaveError()
    );
  }

  protected onSaveSuccess(): void {
    this.isSaving = false;
    this.previousState();
  }

  protected onSaveError(): void {
    this.isSaving = false;
  }

  addDetail(demandeId: number) {
    // sauvegarde du formilaire
    this.save();

    this.router.navigate(['/detail-demande/new'], {
      queryParams: { demandeId }
    });
  }
}

пакет. json

{
  "name": "kproject-mspurchasing",
  "version": "0.0.1-SNAPSHOT",
  "description": "Description for kproject_mspurchasing",
  "private": true,
  "license": "UNLICENSED",
  "cacheDirectories": [
    "node_modules"
  ],
  "dependencies": {
    "@angular/animations": "8.2.14",
    "@angular/cdk": "~8.2.3",
    "@angular/common": "8.2.14",
    "@angular/compiler": "8.2.14",
    "@angular/core": "8.2.14",
    "@angular/forms": "8.2.14",
    "@angular/material": "^8.2.3",
    "@angular/platform-browser": "8.2.14",
    "@angular/platform-browser-dynamic": "8.2.14",
    "@angular/router": "8.2.14",
    "@fortawesome/angular-fontawesome": "0.5.0",
    "@fortawesome/fontawesome-svg-core": "1.2.26",
    "@fortawesome/free-solid-svg-icons": "5.12.0",
    "@ng-bootstrap/ng-bootstrap": "5.1.4",
    "@ngx-translate/core": "11.0.1",
    "@ngx-translate/http-loader": "4.0.0",
    "bootstrap": "4.4.1",
    "bootswatch": "4.4.1",
    "core-js": "3.5.0",
    "moment": "2.24.0",
    "ng-jhipster": "0.11.5",
    "ngx-cookie": "4.0.2",
    "ngx-infinite-scroll": "8.0.1",
    "ngx-webstorage": "4.0.1",
    "rxjs": "6.5.3",
    "swagger-ui-dist": "3.24.3",
    "tslib": "1.10.0",
    "zone.js": "0.10.2"
  },
  "devDependencies": {
    "@angular/cli": "8.3.20",
    "@angular/compiler-cli": "8.2.14",
    "@ngtools/webpack": "8.3.20",
    "@openapitools/openapi-generator-cli": "1.0.10-4.2.3",
    "@types/jest": "24.0.23",
    "@types/node": "12.12.17",
    "@typescript-eslint/eslint-plugin": "2.11.0",
    "@typescript-eslint/eslint-plugin-tslint": "2.11.0",
    "@typescript-eslint/parser": "2.11.0",
    "angular2-template-loader": "0.6.2",
    "autoprefixer": "9.7.3",
    "base-href-webpack-plugin": "2.0.0",
    "browser-sync": "2.26.7",
    "browser-sync-webpack-plugin": "2.2.2",
    "cache-loader": "4.1.0",
    "codelyzer": "5.2.0",
    "copy-webpack-plugin": "5.1.1",
    "css-loader": "3.3.2",
    "eslint": "6.7.2",
    "eslint-config-jhipster": "0.0.1",
    "eslint-config-prettier": "6.7.0",
    "eslint-loader": "3.0.3",
    "file-loader": "5.0.2",
    "fork-ts-checker-webpack-plugin": "3.1.1",
    "friendly-errors-webpack-plugin": "1.7.0",
    "generator-jhipster": "6.7.1",
    "html-loader": "0.5.5",
    "html-webpack-plugin": "3.2.0",
    "husky": "3.1.0",
    "jest": "24.9.0",
    "jest-date-mock": "1.0.7",
    "jest-junit": "10.0.0",
    "jest-preset-angular": "8.0.0",
    "jest-sonar-reporter": "2.0.0",
    "lint-staged": "8.2.1",
    "merge-jsons-webpack-plugin": "1.0.20",
    "mini-css-extract-plugin": "0.8.0",
    "moment-locales-webpack-plugin": "1.1.2",
    "optimize-css-assets-webpack-plugin": "5.0.3",
    "postcss-loader": "3.0.0",
    "prettier": "1.19.1",
    "reflect-metadata": "0.1.13",
    "rimraf": "3.0.0",
    "sass": "1.23.7",
    "sass-loader": "8.0.0",
    "simple-progress-webpack-plugin": "1.1.2",
    "style-loader": "1.0.1",
    "terser-webpack-plugin": "2.3.0",
    "thread-loader": "2.1.3",
    "to-string-loader": "1.1.6",
    "ts-loader": "6.2.1",
    "tslint": "5.20.1",
    "typescript": "3.4.5",
    "webpack": "4.41.2",
    "webpack-bundle-analyzer": "3.6.0",
    "webpack-cli": "3.3.10",
    "webpack-dev-server": "3.9.0",
    "webpack-merge": "4.2.2",
    "webpack-notifier": "1.8.0",
    "workbox-webpack-plugin": "4.3.1",
    "write-file-webpack-plugin": "4.5.1"
  },
  "engines": {
    "node": ">=8.9.0"
  },
  "scripts": {
    "prettier:format": "prettier --write \"{,src/**/}*.{md,json,ts,css,scss,yml}\"",
    "lint": "eslint . --ext .js,.ts",
    "lint:fix": "npm run lint -- --fix",
    "ngc": "ngc -p tsconfig-aot.json",
    "cleanup": "rimraf target/classes/static/ target/classes/aot",
    "clean-www": "rimraf target/classes/static/app/{src,target/}",
    "start": "npm run webpack:dev",
    "start-tls": "npm run webpack:dev -- --env.tls",
    "serve": "npm run start",
    "build": "npm run webpack:prod",
    "test": "npm run lint && jest --coverage --logHeapUsage -w=2 --config src/test/javascript/jest.conf.js",
    "test:watch": "npm run test -- --watch",
    "webpack:dev": "npm run webpack-dev-server -- --config webpack/webpack.dev.js --inline --hot --port=9060 --watch-content-base --env.stats=minimal",
    "webpack:dev-verbose": "npm run webpack-dev-server -- --config webpack/webpack.dev.js --inline --hot --port=9060 --watch-content-base --profile --progress --env.stats=normal",
    "webpack:build:main": "npm run webpack -- --config webpack/webpack.dev.js --env.stats=minimal",
    "webpack:build": "npm run cleanup && npm run webpack:build:main",
    "webpack:prod:main": "npm run webpack -- --config webpack/webpack.prod.js --profile",
    "webpack:prod": "npm run cleanup && npm run webpack:prod:main && npm run clean-www",
    "webpack:test": "npm run test",
    "webpack-dev-server": "node --max_old_space_size=4096 node_modules/webpack-dev-server/bin/webpack-dev-server.js",
    "webpack": "node --max_old_space_size=4096 node_modules/webpack/bin/webpack.js"
  },
  "jestSonar": {
    "reportPath": "target/test-results/jest",
    "reportFile": "TESTS-results-sonar.xml"
  }
}

detail-demande.service.ts

import { Injectable } from '@angular/core';
import { HttpClient, HttpResponse } from '@angular/common/http';
import { Observable } from 'rxjs';

import { SERVER_API_URL } from 'app/app.constants';
import { createRequestOption } from 'app/shared/util/request-util';
import { IDetailDemande } from 'app/shared/model/detail-demande.model';

type EntityResponseType = HttpResponse<IDetailDemande>;
type EntityArrayResponseType = HttpResponse<IDetailDemande[]>;

@Injectable({ providedIn: 'root' })
export class DetailDemandeService {
  public resourceUrl = SERVER_API_URL + 'api/detail-demandes';

  constructor(protected http: HttpClient) {}

  create(detailDemande: IDetailDemande): Observable<EntityResponseType> {
    return this.http.post<IDetailDemande>(this.resourceUrl, detailDemande, { observe: 'response' });
  }

  update(detailDemande: IDetailDemande): Observable<EntityResponseType> {
    return this.http.put<IDetailDemande>(this.resourceUrl, detailDemande, { observe: 'response' });
  }

  find(id: number): Observable<EntityResponseType> {
    return this.http.get<IDetailDemande>(`${this.resourceUrl}/${id}`, { observe: 'response' });
  }

  findByIdDemande(id: number): Observable<EntityArrayResponseType> {
    return this.http.get<IDetailDemande[]>(`${this.resourceUrl + '/all'}/${id}`, { observe: 'response' });
  }
}

1 Ответ

0 голосов
/ 22 марта 2020

Я решил свою проблему следующим образом:

 loadDetail():void {
    if(this.demande.id) {
      this.detailDemandeService.findByIdDemande(this.demande.id).subscribe((res: HttpResponse<IDetailDemande[]>) => {
        if(res.body) {
          this.detailDemandes = res.body;
        }
      });
    }
  }
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...