小编Ada*_*ond的帖子

.cdk-drag-preview 不应用样式

我正在使用 cdk 从角度材质拖放,但拖动预览未按预期工作。我希望预览看起来与被拖动的元素完全相同,但预览仅显示元素的文本内容(不风格)。

HTML:

<div *ngFor="let field of fields$ | async" class="fields-list-container" cdkDrag cdkDragLockAxis="y">
            <div class="fields-name-desc-icon">
                <i class="fa fa-tag"></i>
                <div>
                    <div>{{field.name}}</div>
                    <div><em>{{field.displayType | titlecase }}</em>( )</div>
                </div>
            </div>
            <div>
                {{field.codingGroupField.creatorName}}
            </div>
            <div>{{field.codingGroupField.createdOn | date: 'medium' }}</div>
            <actions-menu [actions]="" [actionOn]=""></actions-menu>
        </div>
Run Code Online (Sandbox Code Playgroud)

CSS:

.fields-list-container {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 1rem;
        border: solid 1px #ccc;
        border-radius: 4px;
        cursor: move;

        .fields-name-desc-icon {
            display: flex;

            div {
                margin-left: .5rem;
            }

            div:nth-child(2) {
                font-size: 10px;
            }
        }

        .fa-tag {
            color: var(--rational-dark-blue);
        }
    } …
Run Code Online (Sandbox Code Playgroud)

css angular-material angular

7
推荐指数
1
解决办法
8626
查看次数

标签 统计

angular ×1

angular-material ×1

css ×1