从Web服务角度ui-grid显示数据的最佳方法

Question

I'm getting back an object from my web service. It looks like:

public DateTime CreationTime { get; set; } public bool Glossar { get; set; } public ICollection<BdConfigTablesTranslation> BdConfigTablesTranslations { get; set; } public ICollection<BdConfigTablesField> BdConfigTablesFields { get; set; } public ICollection<BdContent> BdContents { get; set; }

`ConfigTablesField looks like:

[ForeignKey("BdConfigTableId")]
public BdConfigTable BdConfigTable { get; set; }
public int BdConfigTableId { get; set; }

[Required]
public bool FieldRequired { get; set; }

[Required]
public FieldType FieldType { get; set; }    
public ICollection<BdContentField> BdContentFields { get; set; }
public ICollection<BdConfigTablesFieldsTranslation> BdConfigTablesFieldsTranslation { get; set; }

I think ui-grid is not the best way to show data with a lot of arrays inside the object?

Answer 1

Using multi-level arrays as your data source is always going to be confusing no matter what tool you use, but UI-Grid can do it fine.

You just need to bind to the right property path. Let's say you have an array of friends where each array has the friend's first and last name as its elements. If you wanted to bind to the first friend's first name, you would use friends[0][0] as the field . Here's what that would look like:

columnDefs = [
  { name: 'Name', field: 'name' },
  { name: '1st Friend 1st Name', field: 'friends[0][0]' },
];

data = [
  {
    "name": "Cox",
    "friends": [
      [
        'Bob',
        'Jones'
      ],
      [
        'Mary',
        'Smith'
      ]
    ]
};

If you want to learn more about using complex bindings you can read this post: http://brianhann.com/6-ways-to-take-control-of-how-your-ui-grid-data-is-displayed/ (caveat: I'm the author), and look at the docs here: http://ui-grid.info/docs/#/tutorial/106_binding .