Как мы можем связать событие для пользовательского флажка в Kendo UI Grid Column с помощью Vue Js?

Question

здесь я установил метод checkboxToggle() на флажок, но не знаю, почему он не работает, когда я нажимаю на флажок, он не вызывает этот метод, ПОЧЕМУ?

Здесьмой код:

`Методы: {

 toggleTemplate(){
    let template =
       `<label class="switch" >
        <input type="checkbox" class="user-status" # if(Status){#checked#}                                         #               v-on:click="checkboxToggle()"/>
        <span class="slider round"></span></label>`;

    let compiledTemplate = kendo.template(template);
    return compiledTemplate.bind(this);

},
 checkboxToggle(){
        //TODO Grid checkbox template event binding not working
        alert("Checkbox Toggle !!!")
}

}

еще один

<kendo-datasource ref="localDataSource" :data="filteredUsers"
            :group='groupingFiled'>
            </kendo-datasource>
          <kendo-grid :height="500"  :data-source-ref="'localDataSource'"  :resizable="true"
            :filterable="false":sortable-allow-unsort="true":sortable-show-indexes="true"
            :scrollable-virtual="true" :pageable-numeric="false"
            :pageable-previous-next="false" :pageable-messages-display="'Showing {2} users'"
            :editable="'popup'":toolbar="[{name: 'excel', text: 'Excel'}]"
            :excel-file-name="'Motadata_UserListing.xlsx'" :excel-filterable="true" >
            <kendo-grid-column :selectable="true" :width="35"></kendo-grid-column>
            <kendo-grid-column :field="'UserId'" :hidden="true"></kendo-grid-column>
            <kendo-grid-column :field="'UserName'"  :width="150"></kendo-grid-column>
            <kendo-grid-column :field="'UserType'":width="180"></kendo-grid-column>
            <kendo-grid-column :field="'Role'" :width="120"></kendo-grid-column>
            <kendo-grid-column :field="'AssignedGroups'"  ></kendo-grid-column>
            <kendo-grid-column :field="'Email'":width="210" ></kendo-grid-column>
            <kendo-grid-column :field="'Description'":width="200" ></kendo-grid-column>

       <kendo-grid-column :field="'Status'"
                               :width="170"
                               :template="this.toggleTemplate()"></kendo-grid-column></kendo-grid>

Помощь будетценится

Answer 1

Я нашел здесь Sol -:

Вообще говоря, шаблоны пользовательского интерфейса Kendo не могут привязывать обработчики событий к отображаемым элементам.Таким образом, чтобы достичь желаемого результата, мы должны использовать нативные шаблоны Vue:

https://www.telerik.com/forums/how-can-we-bind-event-for-custom-checkbox-on-kendo-ui-grid-column-using-vue-js

использовать этот пример: https://codesandbox.io/s/840nl43698

это помогает мне, надеюсьВы, ребята, нашли это полезным

Спасибо