Angular 8, проблема вызова функции из другого компонента

Question

Попытка вызвать модал создания тега из другого Компонента.

Компонент, в котором я работаю, называется домашними животными и находится в: app / main / ClientPatientManagement / Pets

Trying чтобы получить доступ к методу show () в: app / main / tags / tags / create-or-edit-tag-modal.component '

Вот код в моем Pets.Component:

    import { CreateOrEditTagModalComponent } from '@app/main/tags/tags/create-or-edit-tag-modal.component';
@Component({
    templateUrl: './pets.component.html',
    encapsulation: ViewEncapsulation.None,
    animations: [appModuleAnimation()]
})
export class PetsComponent extends AppComponentBase {

    @ViewChild('createOrEditTagModal', { static: true }) createOrEditTagModal: CreateOrEditTagModalComponent;

Вот другой код, включая ngOnInit et c. но я хочу вызвать приведенную ниже функцию при нажатии кнопки:

createTag(): void {
        this.createOrEditTagModal.show();
    }

Моя проблема заключается в том, что я получаю сообщение об ошибке, говоря, что my this.createOrEditTagModal не определено.

Я также импортировал этот компонент в моем main.module.ts и добавил его в мои объявления там.

Кто-нибудь может мне помочь, почему это остается неопределенным?

РЕДАКТИРОВАТЬ: Для полноты я добавил некоторый код от создания-или-редактирования-тега-модального компонента

@Component({
    selector: 'createOrEditTagModal',
    templateUrl: './create-or-edit-tag-modal.component.html'
})
export class CreateOrEditTagModalComponent extends AppComponentBase {

    @ViewChild('createOrEditModal', { static: true }) modal: ModalDirective;

    @Output() modalSave: EventEmitter<any> = new EventEmitter<any>();

    constructor(
        injector: Injector,
        private _tagsServiceProxy: TagsServiceProxy
    ) {
        super(injector);
    }


    show():void{
        console.info("Called tag component successfully!"); //for testing
    }

Answer 1

Хорошие новости, обнаружил проблему!

проблема была в моем любимом компоненте. html. Я забыл объявить мой модальный там, поэтому я добавил это в pets.component. html:

<createOrEditTagModal #createOrEditTagModal (modalSave)="getPets()"></createOrEditTagModal>

Это удалось исправить проблему, теперь работает гладко и без ошибок. Обратите внимание, что функция getPets () вызывается после собственной функции сохранения модала, поэтому она просто обновляет страницу.

Answer 2

Я думаю, что этот первый параметр неверен в вашем коде.

@ ViewChild ('createOrEditTagModal', {stati c: true}) createOrEditTagModal: CreateOrEditTagModalComponent;

Должен быть изменен как

@ ViewChild (CreateOrEditTagModalComponent, {stati c: true}) createOrEditTagModal: CreateOrEditTagModalComponent;

Кроме того, убедитесь, что pets.component. html * * * * * * * * * * * * *

Answer 3

Можете ли вы попытаться дать директиву декоратора, как это:

@Directive({selector: 'createOrEditTagModal'})
export class CreateOrEditTagModalComponent extends AppComponentBase {