Question

我正在尝试实施此Ag Grid for Angular CLI，我已按照他们在文档中提到的每个步骤进行操作，但“值”列为空且未显示数据。我在控制台中看不到任何错误。我试着调试但没有运气。请帮忙

请告诉我我做错了什么

MyGridApplicationComponent

＆＃13;

import {
  Component,
  OnInit
} from '@angular/core';
import {
  GridOptions
} from "ag-grid";
import {
  RedComponentComponent
} from "../red-component/red-component.component";


@Component({
  selector: 'app-my-grid-application',
  templateUrl: './my-grid-application.component.html',
  styleUrls: ['./my-grid-application.component.css']
})
export class MyGridApplicationComponent {
  private gridOptions: GridOptions;

  constructor() {
    this.gridOptions = < GridOptions > {};
    this.gridOptions.columnDefs = [{
        headerName: "ID",
        field: "id",
        width: 200
      },
      {
        headerName: "Value",
        field: "value",
        cellRendererFramework: RedComponentComponent,
        width: 200
      },

    ];
    this.gridOptions.rowData = [{
        id: 5,
        value: 10
      },
      {
        id: 10,
        value: 15
      },
      {
        id: 15,
        value: 20
      }
    ]
  }
}

＆＃13;

RedComponentComponent

＆＃13;

import {
  Component
} from "@angular/core";

@Component({
  selector: 'app-red-component',
  templateUrl: './red-component.component.html'
})
export class RedComponentComponent {
  private params: any;

  agInit(params: any): void {
    this.params = params;
  }
}

＆＃13;

Answer 1

我使用cellRenderer而不是框架

ContextMenu

在你的渲染器中你需要渲染一些东西。默认的网格渲染器给出了html，因此您需要这样做。即

<ItemsControl.ItemTemplate>
    <DataTemplate>
        <StackPanel>
            <Button Style="{StaticResource mainButton}"
                                Command="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type ItemsControl}}, Path=DataContext.PlaySound}" 
                                CommandParameter="{Binding Path=Name}"
                                Tag="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type ItemsControl}}}">
                <TextBlock Text="{Binding Path=NormalizedName}" TextWrapping="Wrap" Height="auto" />
                <Button.ContextMenu>
                    <ContextMenu>
                        <MenuItem Header="{Binding Path=Name}" 
                                  Command="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type ContextMenu}}, Path=PlacementTarget.Tag.DataContext.RemoveSound}" 
                                  CommandParameter="{Binding Path=Name}">
                            <MenuItem.Icon>
                                <Image Source="\WpfPractice;component\Images\CoffeeArt.png" Width="20" VerticalAlignment="Center"/>
                            </MenuItem.Icon>
                        </MenuItem>
                    </ContextMenu>
                </Button.ContextMenu>
            </Button>
        </StackPanel>
    </DataTemplate>
</ItemsControl.ItemTemplate>

希望有所帮助

Answer 2

这是一个愚蠢的错误，我没有在Redcomponent html中渲染params值。

下面的代码解决了问题

<span style="color: red">{{params.value}}</span>

Ag Grid不显示数据

2 个答案: