Используя PrimeNG DynamicDialog, я пытаюсь создать согласованный макет заголовка-содержимого-нижнего колонтитула для всех диалогов в моем сценарии использования. При открытии пользовательского компонента диалогового окна в конфигурации диалогового окна есть свойство, называемое шаблонами. Я мог бы успешно создавать собственные компоненты верхнего и нижнего колонтитула, указав свойства header и footer. Что касается контента, я также хотел бы, чтобы некоторые общие элементы применялись во всех пользовательских диалогах, например. индикатор загрузки, сообщение о загрузке, граница и т. д. Я планировал сделать это с помощью NgComponentOutlet для динамической визуализации компонента пользовательского диалогового окна. Однако, когда я указываю свойство содержимого, диалоговое окно не отображает пользовательский компонент диалогового окна должным образом и выдает неопределенную ошибку, описанную ниже.
DynamicDialogConfig
Код: Выделить всё
{
// other properties
templates: {
footer: Footer,
content: BaseContent,
},
}
Определение базового контента
Код: Выделить всё
@Component({
selector: 'base-content',
standalone: true,
imports: [CommonModule],
template: `
`,
})
export class BaseContent implements OnInit {
projectedComponent = null;
constructor(public ref: DynamicDialogRef) {}
async ngOnInit() {
this.projectedComponent = await firstValueFrom(
this.ref.onChildComponentLoaded
);
}
}
Неопределенная ошибка
При отладке я обнаружил, что при вызове loadChildComponent() возникает ошибка. Точнее, точка вставки не определена.
источник
Минимальный воспроизводимый пример:
PrimeNG DynamicDialog — шаблон содержимого
Что-то не так с дизайном? или с использованием свойства content?
Подробнее здесь:
https://stackoverflow.com/questions/797 ... cdialogtem