Не удается разрешить все параметры в директиве проверки во время сборки ng --prod

Question

Я перешел к следующим вопросам, но не нашел решения.

• Ошибка директивы Angular 4: Не удается разрешить все параметры для директивы
• Не удается разрешить все параметры для пользовательской директивы

Я создал специальную директиву проверки для проверки уникальной постоянной ссылки.этот код работает нормально, но когда я пытаюсь создать сборку для производства, он выдает мне следующую ошибку: -

ОШИБКА в: Не удается разрешить все параметры для UniquePermalinkValidatorDirective в E: / Manish / Projects /ampleAdmin / src / app / shared / permalink-validation.directive.ts: ([объект]]? *. 1016 *

permalink-validation.directive.ts

import { Directive } from '@angular/core';
import { AsyncValidator, AbstractControl, ValidationErrors, NG_ASYNC_VALIDATORS, AsyncValidatorFn } from '@angular/forms';
import { Observable, of } from 'rxjs';
import { map } from 'rxjs/operators';
import * as qs from 'qs';
import { PageService } from '../services/page.service';
import { IPage } from '../client-schema';

export function UniquePermalinkValidator(pageService: PageService, page: IPage): AsyncValidatorFn {
  return (ctrl: AbstractControl): Promise<ValidationErrors | null> | Observable<ValidationErrors | null> => {
    if (!(ctrl && ctrl.value)) { return null; }

    const cond: any = {
      where: {
        permalink: ctrl.value
      }
    };

    if (page && page.id) {
      cond.where.id = { nin: [page.id]};
    }
    const query = qs.stringify(cond, { addQueryPrefix: true });

    return pageService.getPageCount(query).pipe(
      map(res => {
        return res && res.count ? { uniquePermalink: true } : null;
      })
    );
  };
}

@Directive({
  selector: '[appUniquePermalink]',
  providers: [{ provide: NG_ASYNC_VALIDATORS, useExisting: UniquePermalinkValidatorDirective, multi: true }]
})
export class UniquePermalinkValidatorDirective implements AsyncValidator {

  constructor(private pageService: PageService, private page: IPage) { }

  validate(ctrl: AbstractControl): Promise<ValidationErrors | null> | Observable<ValidationErrors | null> {
    return UniquePermalinkValidator(this.pageService, this.page)(ctrl);
  }
}

page.component.ts

import { Component, OnInit, TemplateRef } from '@angular/core';
import * as _ from 'lodash';
import { NotifierService } from 'angular-notifier';
import { BsModalService, BsModalRef } from 'ngx-bootstrap/modal';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { IPage } from 'src/app/client-schema';
import { Utils } from 'src/app/shared/utils';
import { PageService } from 'src/app/services/page.service';
import { UniquePermalinkValidator } from 'src/app/shared/permalink-validation.directive';

@Component({
  selector: 'app-page',
  templateUrl: './page.component.html',
  styleUrls: ['./page.component.css']
})
export class PageComponent implements OnInit {

  private notifier: NotifierService;

  pageForm: FormGroup;
  pageDetail: IPage;

  isAddFold = false;
  isEditFold = false;
  editFoldIndex = -1;

  constructor(
    private pageService: PageService,
    private notifierService: NotifierService,
    private modalService: BsModalService,
    private formBuilder: FormBuilder,
  ) {
    this.notifier = notifierService;
  }

  initPageForm() {
    this.pageForm = this.formBuilder.group({
      name: ['', [Validators.required, Validators.minLength(2), Validators.maxLength(250)]],
      permalink: ['', [Validators.required], UniquePermalinkValidator(this.pageService, this.pageDetail)],
      folds: [
        []
      ],
      data: null,
      status: true
    });
  }
}

Я использую одну форму для добавления / редактирования страницы, поэтому мне нужно требовать сведения о записях, чтобы разрешить постоянную ссылку на редактирование страницы,

есть ли способ передать детали текущей страницы в директиву?

Answer 1

Учитывая

export function UniquePermalinkValidator(pageService: PageService, page: IPage): AsyncValidatorFn {
  // ...
}

И учитывая

@Directive({
  selector: '[appUniquePermalink]',
  providers: [{ provide: NG_ASYNC_VALIDATORS, useExisting: UniquePermalinkValidatorDirective, multi: true }]
})
export class UniquePermalinkValidatorDirective implements AsyncValidator {    
  constructor(private pageService: PageService, private page: IPage) {}
  // ...
}

И учитывая, что IPage определяется исключительно

export interface IPage {
  id: number;
  // ...
}

ТогдаUniquePermalinkValidatorDirective не будет работать по определению, с ошибкой описанным способом.

interface определяет что-то только в типе пробеле, но не в значении пробеле ипоэтому не имеет никакого проявления во время выполнения вообще.Это означает, что его нельзя использовать в позиции значения.

В сущности, система внедрения зависимостей Angular считывает тип параметров конструктора и, когда в имеется соответственно именованное объявление.значение пробел, оно будет использовать это соответственно именованное значение в качестве токена инъекции.

Например, следующее

import {Injectable} from '@angular/core';

@Injectable() export class Service {
    constructor(http: Http) {}
}

также может быть записано

import {Inject} from '@angular/core';

export class Service {
    constructor(@Inject(Http) http: ThisTypeIsArbitraryWithRespectToInjection) {}
}

, что означает то же самое

Обратите внимание, как Httpпередать в качестве аргумента Inject.Но Inject(IPage), где IPage - это interface, имеет неправильный формат.

Основная цель @Inject(ProviderToken) - дать возможность вводить поставщика ортогонально типу декорированного параметра в таких случаях.как ваш.

Поэтому вам нужно что-то вроде

constructor(@Inject(PageProviderToken) page) {}

Это означает, что нужно определить токен и использовать его для регистрации провайдера, который может быть введен.

Можно и нужно писать по-прежнему

constructor(@Inject(PageProviderToken) page: IPage) {}

, чтобы придать параметру тип, но тип не связан со значением, введенным для параметра.

Например,

import {InjectionToken, NgModule} from '@angular/core';

export const PageProviderToken = new InjectionToken('PageProviderToken');

@NgModule({
  providers: [
    {
      provide: PageProviderToken,
      useFactory: anAppropriatePageLikeValue
    }
  ]
 }) export class // ...