Using custom dialog title does not scroll lock

[James]

I am building a dialog using ng-template as per the documentation. 

 

https://www.telerik.com/kendo-angular-ui/components/dialogs/dialog/service/#toc-using-templates

 

I want to provide a custom title bar.  So I am using the <kendo-dialog-titlebar> directive to create my title.  This displays correctly but if my dialog window is too long and I have to scroll, then I lose the title bar when I scroll to the bottom.  The title bar should remain locked at the top no matter where I scroll.  Here is an example I  modified from the docs

 

https://stackblitz.com/edit/angular-ft4nau

 

How can i create a custom title bar and have it scroll locked?

[Dimiter Topalov]

Hello James,

The described behavior is to be expected, as the Title template is passed as part of the Dialog content, and thus is rendered within the content area.

You can set a custom title either via providing the desired custom text in the "title" property of the Dialog configuration settings object:

https://stackblitz.com/edit/angular-ft4nau-1zsyvn?file=app/app.component.ts

... or if additional markup needs to be added like in the describe use case, provide a whole component that will contain the Dialog Title and Content like in the following demos:

https://www.telerik.com/kendo-angular-ui/components/dialogs/dialog/service/#toc-passing-title-content-and-actions-as-a-single-component

Here is the same example, adjusted to better match the provided code:

https://stackblitz.com/edit/angular-3ms2bn?file=app/user-info.component.ts

I hope this helps.

Regards,
Dimiter Topalov
Progress Telerik