Разбор дополнительных параметров в директиву Angular в качестве отдельных параметров - PullRequest
0 голосов
/ 03 марта 2020

Я пытаюсь передать два параметра моей директиве как отдельные параметры. Мне удается добавить параметры как один параметр (* ovLoading = "! IsDataReceived; noBackground: true"), но я хотел бы иметь его как два отдельных параметра, это как-то возможно?:

Моя директива выглядит вот так:

    @Directive({
    selector: `[ovLoading]`,
})
export class LoadingDirective implements OnChanges, OnInit {
    @Input() public ovLoading: boolean;
    @Input() public ovLoadingNoBackground = false;

    private factory: ComponentFactory<LoaderComponent>;
    private viewRef: EmbeddedViewRef<any>;
    private loaderComponent: ComponentRef<LoaderComponent>;

    constructor(
        private templateRef: TemplateRef<any>,
        private viewContainerRef: ViewContainerRef,
        private componentFactoryResolver: ComponentFactoryResolver,
    ) {
        this.factory = this.componentFactoryResolver.resolveComponentFactory(LoaderComponent);
    }

    public ngOnInit() {
    }

    public ngOnChanges() {
        if (this.viewRef == null) {
            this.viewRef = this.viewContainerRef.createEmbeddedView(this.templateRef);
        }

        if (this.ovLoading) {
            this.loaderComponent = this.viewContainerRef.createComponent(this.factory);
            this.loaderComponent.instance.noBackground = this.ovLoadingNoBackground;
        } else if (this.loaderComponent != null) {
            this.viewContainerRef.remove(this.viewContainerRef.indexOf(this.loaderComponent.hostView));
            this.loaderComponent = null;
        }
    }
}

Вот как я ее использую (это работает):

<div class="header" *ovLoading="!isDataReceived;noBackground:true"></div>

И я бы хотел, чтобы это было примерно так (это не работает):

<div class="grid-view-header" *ovLoading="!isDataReceived" noBackground="true">

1 Ответ

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

Вы определяете свой ввод следующим образом:

@Input() public ovLoadingNoBackground = false;

, но используете его следующим образом:

noBackground="true"

возможно, если вы установите входное значение

@Input() public noBackground = false;

это будет работать.

хотя можно сделать то, что вы просите, см. Следующий вопрос SO: Как передать несколько параметров в @Directives (@Components) в Angular с помощью TypeScript?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...