小编Nul*_*ull的帖子

Angular 4.3.6动画无法正常工作

从Angular 4.3.5迁移到4.3.6之后动画的东西变坏了(4.3.5就是一切都好).

问题是,当应用程序启动时,会加载登录组件,并且该组件fadeIn会显示动画.升级到最新的角度版本后,我的组件在加载应用程序后总是隐藏.我检查了登录组件,发现它已经style="display: none";应用了.

我正在使用外部animations.ts文件来存储我的所有动画.

animations.ts

import { animate, state, style, transition, trigger } from '@angular/animations';

// Fade In Animation
export const fadeIn = trigger('fadeIn', [
    transition('void => *', [
        style({ opacity: 0 }),
        animate(500, style({ opacity: 1 }))
    ])
]);
Run Code Online (Sandbox Code Playgroud)

login.component.ts

import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';

import { AuthenticationService } from '../../services/authentication.service';

import { fadeIn } from './../../shared/animations/animations';

@Component({
    moduleId: module.id,
    selector: 'app-authentication',
    templateUrl: './authentication.component.html',
    styleUrls: ['./authentication.component.css'], …
Run Code Online (Sandbox Code Playgroud)

angular angular-animations

21
推荐指数
1
解决办法
1183
查看次数

TanStack React table v8 根据单元格值设置每个单元格的样式

我们正在将表从 v7 迁移到 v8。我对单元格条件样式有点疑问。所以基本上我想做的是,根据状态(即将进入表数据),我需要向行中的每个单元格添加特定的类名。

在 v7 中我们使用了这个: https: //react-table-v7.tanstack.com/docs/examples/data-driven-classes-and-styles

但在 v8 中我找不到类似的东西......

到目前为止,我尝试meta在列定义中使用https://tanstack.com/table/v8/docs/api/core/column-def#meta,我可以在其中为 className 属性设置一些值,并在我的 JSX 中使用它,如下所示:

className={cell.column.columnDef.meta?.className}

但问题是我可以设置为元的任何内容都是静态值。对于我的情况,我需要根据我的状态值设置特定的 className。似乎在元中我们无法访问任何单元格道具......

const driverFormatter = ({ row }) => {
  const { status } = row.original;

  return <span>{status}</span>;
};

const columns: ColumnDef<any,any>[] = [
    {
      accessorKey: "customerName",
      header: "Customer"
    },
    {
      accessorKey: "driver",
      header: "Driver",
      enableSorting: false,
      cell: driverFormatter,
      meta: {
          className: "disabled",
     },
    },
    ...
Run Code Online (Sandbox Code Playgroud)

那么有什么方法可以使用 v8 来实现这一点吗?

谢谢你!

typescript reactjs react-table react-table-v8

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

jQuery Datatables 如何打印带有行分组的表格?

几天来,我试图实现带有行分组的数据表打印视图,但仍然不起作用..:(

我有一个数据表,其中隐藏一列,并且该列按行分组。与此示例相同:https ://datatables.net/examples/advanced_init/row_grouping.html

我正在使用按钮扩展(https://datatables.net/extensions/buttons/)作为打印按钮。当我点击打印按钮时,我看到数据表的所有列,甚至应该隐藏一列。然后我使用了一个选项“columns”:“:visible”,仅打印可见列,但它又不好,因为分组的行丢失了。

那么有谁知道如何在打印视图中获得与原始数据表相同的行分组表?

table = $('#vartTable').DataTable({
            "dom": "Bt",
            "paging": false,
            "fixedHeader": {   
                "headerOffset": -10
            },
            "autoWidth": false,
            "ordering": false,
            "data": data,
            "columns": [
                {"data": "path",},
                {
                    "data": "username",
                    "render": function(data, type, row) {
                        return '<a href="User-view.do?varId=' + row.id + '">' + row.username+ '</a>';
                    }
                },
                {
                    "data": "name",
                    "render": function (data, type, row) {
                        return row.name+ ' ' + row.surname;
                    }
                },
                {"data": "details"}
            ],
            "columnDefs": [{"visible": false, "targets": 0}],

            "buttons": [
                {
                    "extend": 'print', …
Run Code Online (Sandbox Code Playgroud)

jquery datatables

5
推荐指数
1
解决办法
7460
查看次数