标签: expandable-table

我在过去的两个星期中尝试使此代码正常工作。我搜索并尝试了Philipp Kief的解决方案，这是我可以部分理解的解决方案。我是新来的。

我还研究了其他解决方案。何维利2和何维利3

不幸的是，我被卡住了，不知道为什么桌子不能展开。我没有收到错误，但是似乎(click)并且MatRipple似乎已经做出回应。我也尝试过，进行材料扩展面板，但这似乎不可行。有人可以指出我正确的方向吗？谢谢。

import { Component, OnInit, ViewChild } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { DataSource } from '@angular/cdk/collections';
import { Incident } from './interface';
import {
  MatSort,
  MatTableDataSource,
  ICON_REGISTRY_PROVIDER,
  MatPaginator
} from '@angular/material';
import {
  animate,
  state,
  style,
  transition,
  trigger
} from '@angular/animations';
import { switchMap, concatMap } from 'rxjs/operators';
import { interval } from 'rxjs';
import { timer } from 'rxjs/observable/timer';

@Component({ …

我在我的应用程序中使用 antd design 4.10 版的可扩展表和 Next.js v10.0.4。当我单击+表中的按钮时，它应该只打开选定的行，但我不知道为什么它同时打开所有行。

这是我的表格组件：

<Table
    size="small"
    dataSource={data}
    columns={updateColumns}
    expandable={{
      expandedRowRender: (record) => (
        <p style={{ margin: 0 }}>{record.description}</p>
      ),
      rowExpandable: (record) => record.level !== "3",
      onExpand: (expanded, record) =>
        console.log("onExpand: ", record, expanded),
    }}
  />

与antd design中的文档代码完全相同：https://ant.design/components/table/#components-table-demo-expand

我想使用JQuery创建一个可扩展的表:http://ludo.cubicphuse.nl/jquery-treetable/#examples.

问题是angularjs和jquery之间存在冲突.这是我的html文件:

<table>
   <tbody ng-repeat="row in construct.matrix.rows">
      <tr data-tt-id="row.name">
         <td>{{row.name}}</td>
         <td>
            <button ng-click="newField($index)">Add a Field</button>
            <form ng-submit="addField($index, fieldName, row)" ng-if="choose($index)">
               <input type="text" ng-model="fieldName" name="text" placeholder="New Field" />
            </form>
         </td>
      </tr>
   </tbody>
</table>

要使用jquery部分,我使用此标记:

$(document).ready(function() {
   initialize();
});

function initialize() {
   $("table").agikiTreeTable({
      persist : false,
      persistStoreName : "files"
   });
}

我想在开头有一个简单的表,只有一行.在这一行中,用户可以单击一个按钮,然后提交一个新行,该行将是第一行的可扩展行.只是为了看看是否可能,我试图这样做但我明白在提交第一个可扩展行之后我必须回忆起初始化函数.它有效,但如果我想再次进行操作,我会有一些冲突.

看这张图片:

因此,如果有人有想法解决这个问题,我会很高兴听到它.谢谢

我有一个带有可扩展文本单元格的表格视图，每个单元格都有一个带有阴影作为背景的白色视图。

对于设计，我想将单元格阴影合并为图像：

所以，我从单元格中删除了“剪辑子视图”检查。

但是我在扩展动画时遇到了问题，而动画单元格看起来像这样：

当我再次添加“剪辑子视图”检查时，动画问题得到解决，但阴影格式错误并且被裁剪。

有没有办法保持阴影和正确的动画？