Editor Template with Angular

[Christian]

Hi,

Is there any example available which shows how to use a custom editor template with angular?

The thing which is unclear is if I should use ng-model binding in the template and create an angular template or to use # expressions for a kendo template. 

Since the editor template is not directly supported with template directives (http://docs.telerik.com/kendo-ui/AngularJS/introduction#template-directives) I thought this way might be a solution:

$scope.schedulerOptions = {
    [...]
    "editable": { "template": kendo.template(jQuery('#editor-template').html())  },
    [...]
 }

Good idea or bad idea?


Please push me in the right direction!

thx, Chris

[Vladimir Iliev]

Hello Christian,

Both defining the template inside the scheduler options and adding as nested directives are a valid approaches:

<div kendo-scheduler k-options="schedulerOptions">
    <span k-event-template class='custom-event'>{{dataItem.title}}</span>
    <div k-all-day-event-template class='custom-all-day-event'>{{dataItem.title}}</div>
</div>

For more information you can check the following help article:

• Template directives

Regards,
Vladimir Iliev
Telerik

 

 

[Christian]

Hello Vladimir,

I see event-template and all-day-event-template are valid for nested directives. According to the documentation the event editor is not a valid nested directive. 

[Christian]

i.e. this does not work:

<div ng-controller="MyCtrl">
        <div kendo-scheduler k-options="schedulerOptions">
            <span k-event-template class='custom-event'>{{dataItem.title}}</span>
            <div k-all-day-event-template class='custom-all-day-event'>{{dataItem.title}}</div>
            <div k-editable-template>TEST</div> // <-- not supported?
        </div>
    </div>

[Vladimir Iliev]

Hi Christian,

Apologize for not being clear enough - when given template is not listed as supported for nested directive you should fall back to the approach from your original post. 

Regards,
Vladimir Iliev
Telerik