angular-cdk

问题 I'm trying to use the Angular Drag/Drop from the CDK to implement a basic sidebar with draggable elements where the user can drop them anywhere in the "content" area. Meaning, the elements should ultimately be absolutely positioned and should be able to live wherever the user wants them, including on top of each other. I'm trying to use cdkDropListConnectedTo with a cdkDropList. I have it mostly working here, but you can see that when dragging multiple items onto the content area, the

问题 After upgrading @angular/core and @angular/material using ng update command, the ngcc command fails with below error command used: ngcc --properties es2015 browser module main --first-only --create-ivy-entry-points Error: > Compiling @angular/cdk/stepper : es2015 as esm2015 > Compiling @angular/cdk/drag-drop : es2015 as esm2015 > Error: Error on worker #3: Error: Tried to overwrite node_modules/@angular/cdk/stepper/step-header.d.ts.__ivy_ngcc_bak with an ngcc back up file, which is disallowed

问题 I am following a tutorial to implement cdk tree in angular 6. I created a tree structure, now I want to get the parent hierarchy from from the child by making it clickable, while there are methods like getDescendants to get children of a node, vice versa is not available. How can I get the parent hierarchy from a child or leaf node. 回答1: I've added these methods to my tree component. Note that I use the flat tree, this won't work for a nested tree. @Component({ selector: 'es-outline-tree', //

问题 Is it possible to scroll a specific data row into view when using the angular material mat-table cdk-table ? I'm trying to implement keyboard scrolling with no luck. 回答1: I've it working now. Not perfect but it works. See the example on stack blitz mentioned in my earlier message. https://stackblitz.com/edit/mensand-rowselect?file=app%2Ftable-basic-example.html 来源： https://stackoverflow.com/questions/49697459/mat-table-scroll-a-row-into-view-in-angular-2

问题 Is it possible to scroll a specific data row into view when using the angular material mat-table cdk-table ? I'm trying to implement keyboard scrolling with no luck. 回答1: I've it working now. Not perfect but it works. See the example on stack blitz mentioned in my earlier message. https://stackblitz.com/edit/mensand-rowselect?file=app%2Ftable-basic-example.html 来源： https://stackoverflow.com/questions/49697459/mat-table-scroll-a-row-into-view-in-angular-2

问题 I'm trying to create a horizontal draggable list with items that should be editable. For that I'm using the cdk package without material and with the attribute [contentEditable]='true' . But the items are not editable. How do I get it working? <div cdkDropList [cdkDropListOrientation]="'horizontal'" class="namingConventionDragDrop" (cdkDropListDropped)="drop($event)"> <ng-container *ngFor="let item of resultConvention; let i = index;"> <div cdkDrag class="pop naming-placeholder" *ngIf="item

问题 I'm new to angular material drag and drop. My app is using an n-ary tree, and since I don't know its form apriori, I've been forced to use a recursive template in order to represent it. The last couple of days I've been trying to use Angular material drag and drop to reorder siblings. If I remove the root node everything works just fine, but I cannot remove the root node since I need it to traverse the tree for other operations. Bellow is a simplified form of the tree. In reality, the tree

问题 I'm new to angular material drag and drop. My app is using an n-ary tree, and since I don't know its form apriori, I've been forced to use a recursive template in order to represent it. The last couple of days I've been trying to use Angular material drag and drop to reorder siblings. If I remove the root node everything works just fine, but I cannot remove the root node since I need it to traverse the tree for other operations. Bellow is a simplified form of the tree. In reality, the tree

问题 I'm trying to make a custom popover for a table cell, in order to show a cell details when clicking on it, in a way similar to mdBoostrap popovers. For now, I have the following app: https://stackblitz.com/edit/angular-m5rx6j The Popup component shown under the main component, but I would like to show it over the table, just under the element I clicked. I suppose I need to do the following : Get the ElementRef of the 'td' where I click -> I don't know how Attach the overlay to this element ->

问题 How on earth do I add a position strategy ( ConnectedPositionStrategy ) to an overlay? (I'm using Angular Material.) I've tried specifying it via the positionStrategy property and passed it in to overlay.create() . import { Overlay, ConnectedPositionStrategy } from '@angular/cdk/overlay'; // ... export class MyComponent { constructor(private overlay: Overlay){} showOverlay() { let overlay = this.overlay.create({positionStrategy: ConnectedPositionStrategy}); // ... } } But I get this error: