Почему директива из общего модуля не определена? - PullRequest
Новая
       31

Почему директива из общего модуля не определена?

0 голосов
/ 21 февраля 2019

Я использую в приложении angular 7 общий модуль для использования директивы в других других модулях. 

import { Directive, OnInit, HostBinding, Input } from '@angular/core';

@Directive({
    selector: '[appServerSuccess]'
})

export class ServerSuccessDirective implements OnInit {
    @Input() appServerSuccess: string;
    @HostBinding()
    get innerText() {
       return this.appServerSuccess;
    }
    @HostBinding('class.success')
    get success () {
       return this.appServerSuccess.toLocaleLowerCase().includes('success');
    }

    constructor() {}
    ngOnInit() {}
}

В shared.module.ts , у меня есть объявление и экспорт директивы: 

import { NgModule } from "@angular/core";
import { ServerSuccessDirective } from './directives/server-success.directive';


@NgModule({
    imports: [ ],
    declarations: [ ServerSuccessDirective ],
    exports: [ ServerSuccessDirective ]
})

export class SharedModule {}

В каждом из app.module.ts ив user.module.ts , у меня есть импорт SharedModule

Директива используется в различных компонентах приложения. 

<div [appServerSuccess]="msg"></div>

msg передается через службу как: 

private messageSource = new BehaviorSubject('');
currentMessage = this.messageSource.asObservable();

constructor() {
    changeMessage(msg: string) {
        this.messageSource.next( msg );
    }
}

в компонентах app.module , работает нормально, но в другом компонентев user.module выдается следующая ошибка:

Невозможно прочитать свойство 'toLocaleLowerCase' с неопределенным

Это означает, что директива не распознается в user.module .

Правильно импорт в модулях, объявление и экспорт в SharedModule.Где я ошибаюсь?

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

Ответы [ 2 ]

0 голосов
/ 21 февраля 2019

Исправлена ​​ошибка.Он был в компоненте, который принадлежит user.module, и использует / передает значение свойства msg для директивы.

Так, например, в компоненте user-update.component.ts У меня было свойство msg , которое не было инициализировано, например: msg: string.Я изменил это на: msg = '';

0 голосов
/ 21 февраля 2019

значение по умолчанию для инициализированного appServerSuccess равно undefined, поэтому присвойте ему значение перед передачей значения из родительского компонента.

измените эту строку 

 @Input() appServerSuccess: string;

до этой строки 

 @Input() appServerSuccess: string = '';

или любой другой string по умолчанию.

здесь можно посмотретьбольше о typescript variables declarations

...