Hello!
I want to implement your dialog with a the CanDeactive Guard. In order to so I have implemented the CanDeactive Guard
import { CanDeactivate } from '@angular/router';import { Observable } from 'rxjs';import { Injectable } from '@angular/core';export interface CanComponentDeactivate { canDeactivate: () => Observable<boolean> | Promise<boolean> | boolean;}@Injectable({ providedIn: 'root',})export class CanDeactivateGuard implements CanDeactivate<CanComponentDeactivate> { canDeactivate(component: CanComponentDeactivate) { return component.canDeactivate && component.canDeactivate(); }}
and extended my component and created the following function
canDeactivate(): Observable<boolean> | Promise<boolean> | boolean { const dialog: DialogRef = this.dialogService.open({ title: 'Please confirm', content: 'Are you sure?', actions: [{ text: 'No' }, { text: 'Yes', primary: true }], width: 450, height: 200, minWidth: 250, }); if (this.isInEditState) { dialog.result.subscribe((result: any) => { if (result.text === 'No') { return false; } else { return true; } }); } else { return true; }}
I get a dialog, but the result will not trigger the CanDeactive Guard (I think it is undefinied). I think he looses the scope because of the subscribe. Could you guys help me?
Best regards
Felix
Hi,
I have implemented kendo grid using angular. In the same I have virtual scrolling implemented. I want auto fix columns width as per row data. i.e. if any column have data like "testing data for width- should be in one row." it should place in one row. right now it is showing the data into the two lines. for auto fix width - I have added following code
on html page
<kendo-grid #dataTable [data]="query | async" (dataStateChange)="dataStateChange($event)" [resizable]="true" [autoSize]="true">
</kendo-grid>
on component.ts
export class ListComponent extends AppComponentBase implements OnInit, AfterViewInit {
@ViewChild(GridComponent) public grid: GridComponent | undefined;
public constructor( private ngZone: NgZone ) {
super(injector);
}
public ngAfterViewInit(): void {
this.fitColumns();
}
public dataStateChange(state: State): void {
this.fitColumns();
}
private fitColumns(): void {
this.ngZone.onStable.asObservable().pipe(take(1)).subscribe(() => {
this.grid.autoFitColumns();
});
}
}
above code set width as per column's name. I required autofix column width on both column name as well as on row data.
Thanks.
The Tree View component is incredibly frustrating to work with.
How do I establish an indeterminate check box?
Here is my TreeView and below is my isChecked method.
I have attached a snagit capture of the problem I'm having.
<kendo-treeview #actionPermissions [nodes]="treeNodes" kendoTreeViewCheckable [hasChildren]="hasChildren" textField="displayName" childrenField="children" [(checkedKeys)]="checkedKeys" [isChecked]="isChecked" kendoTreeViewHierarchyBinding kendoTreeViewExpandable [(expandedKeys)]="expandedKeys" (checkedChange)="handleChecking($event)">public isChecked = (dataItem: NcActionDto): CheckedState => { let checkedNode = _.find(this.checkedKeys, m => m === dataItem.id); if (checkedNode) { if (dataItem.children.length > 0) { dataItem.children.forEach((item) => { if (!_.find(this.checkedKeys, m => m === item.id)) { return 'indeterminate'; } }); } else { return 'checked'; } } else { return 'none'; }}
I have to say I am a member of many forums and this is without doubt the worst of all for posting information. It's ancient and every difficult to work with.
I used the dropdownlist component outside of <kendo-grid> and by adding the [popupSettings]="{appendTo: 'component'}", I got the selection list displayed right under the dropdown control.
I tried to do the same thing for a dropdownlist of a column inside <kendo-grid>, and the popup did not display right under the dropdown, but over it (see attached image, I selected the dropdown for the 'Hospital C' row).
The HTML for that column is:
<kendo-grid-column field="FileId" title="File Lists" [width]="140">
<ng-template kendoGridCellTemplate
let-dataItem="dataItem"
let-formGroup="formGroup">
<kendo-dropdownlist [data]="fileLists"
#ddl_filelists
[textField]="'description'"
[valueField]="'key'"
[valuePrimitive]="true"
[popupSettings]="{appendTo: 'root'}"
[(ngModel)]="dataItem.FileId">
</kendo-dropdownlist>
</ng-template>
</kendo-grid-column>
Thanks for any suggestion.

Hey,
I have implemented datetimepicker in my project. So I want to disable past times in datetimepicker and I have tried [min] but I dont want that way.
I want a way where previous time shoudl be disabled but should not be disappered.
So please guide if any other way possible.


hi,
We have downloaded a basic virtual scroll grid from kendo’s official website (https://www.telerik.com/kendo-angular-ui/components/grid/scroll-modes/virtual/) to make sure custom code is not causing it. Additional columns (25+) +) were added to it and applied coloring to alternate rows with different colors using the rowClass method that is mentioned in the documentation.
Issue was present in the kendo grid for this scenario.
Please suggest if this is expected behavior or we are missing some configuration here.
PFA the code used for this.
Regards,
Jaspreet
