Ng bootstrap modal don't open - html

Question

I've had this problem since this morning and I can't solve it, I've tried a lot of things but there's no way I can get it opened.
In practice I have to implement a test button that opens a modal with a header and a body, in addition there must be a closing and a disengagement button. This part of HTML works and I tested it, the problem is the part of TypeScript.
In the open function there is the command const modalRef = this.modalService.open(NgbdModalContent); that doesn't work correctly, the fact is that the command works, in fact if instead of NgbdModalContent I put a string works, so it's just NgbdModalContent that should theoretically take HTML.
If you have any idea how to do this would be of immense pleasure, below I leave you the files concerned.
PS. are new to this world, especially about Angular2 and TypeScript so criticism and comments are welcome (I know I've made a big mistake and probably a trivial one (for you)). THANK YOU SO MUCH
TypeScript
import { Component, Input } from '#angular/core';
import {NgbModal, NgbActiveModal} from '#ng-bootstrap/ng-bootstrap';
#Component({
selector: 'post-ngb-modal-demo',
templateUrl: './modal-demo.component.html',
})
export class NgbModalDemoComponent{
constructor(private modalService: NgbModal) {}
open() {
const modalRef = this.modalService.open(NgbdModalContent);
}
}
export class NgbdModalContent {
#Input() name;
constructor(public activeModal: NgbActiveModal) {}
}
HTML
<ng-template #content let-c="close" let-d="dismiss">
<div class="modal-header">
<h4 class="modal-title">Hi there!</h4>
<button type="button" class="close" aria-label="Close" (click)="activeModal.dismiss('Cross click')">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<p>Hello, world!</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-outline-dark" (click)="activeModal.close('Close click')">Close</button>
</div>
</ng-template>
<button class="btn btn-lg btn-outline-primary" (click)="open()">Launch demo modal</button>

Answer 1

I think you need to add dynamically created components to entryComponents inside your #NgModule in your app.module.ts.
#NgModule({
imports: [
....
...
],
declarations: [
NgbdModalContent,
...
],
entryComponents: [NgbdModalContent],
providers: [
....
]
})