Options
All
  • Public
  • Public/Protected
  • All
Menu

Class Table

Creates a Table card.

example

// Simple table
conv.ask('Simple Response')
conv.ask(new Table({
  dividers: true,
  columns: ['header 1', 'header 2', 'header 3'],
  rows: [
    ['row 1 item 1', 'row 1 item 2', 'row 1 item 3'],
    ['row 2 item 1', 'row 2 item 2', 'row 2 item 3'],
  ],
}))

// All fields
conv.ask('Simple Response')
conv.ask(new Table({
  title: 'Table Title',
  subtitle: 'Table Subtitle',
  image: new Image({
    url: 'https://avatars0.githubusercontent.com/u/23533486',
    alt: 'Actions on Google'
  }),
  columns: [
    {
      header: 'header 1',
      align: 'CENTER',
    },
    {
      header: 'header 2',
      align: 'LEADING',
    },
    {
      header: 'header 3',
      align: 'TRAILING',
    },
  ],
  rows: [
    {
      cells: ['row 1 item 1', 'row 1 item 2', 'row 1 item 3'],
      dividerAfter: false,
    },
    {
      cells: ['row 2 item 1', 'row 2 item 2', 'row 2 item 3'],
      dividerAfter: true,
    },
    {
      cells: ['row 3 item 1', 'row 3 item 2', 'row 3 item 3'],
    },
  ],
  buttons: new Button({
    title: 'Button Title',
    url: 'https://github.com/actions-on-google'
  }),
}))
example

// Simple table
conv.ask('Simple Response')
conv.ask(new Table({
  dividers: true,
  columns: ['header 1', 'header 2', 'header 3'],
  rows: [
    ['row 1 item 1', 'row 1 item 2', 'row 1 item 3'],
    ['row 2 item 1', 'row 2 item 2', 'row 2 item 3'],
  ],
}))

// All fields
conv.ask('Simple Response')
conv.ask(new Table({
  title: 'Table Title',
  subtitle: 'Table Subtitle',
  image: new Image({
    url: 'https://avatars0.githubusercontent.com/u/23533486',
    alt: 'Actions on Google'
  }),
  columns: [
    {
      header: 'header 1',
      align: 'CENTER',
    },
    {
      header: 'header 2',
      align: 'LEADING',
    },
    {
      header: 'header 3',
      align: 'TRAILING',
    },
  ],
  rows: [
    {
      cells: ['row 1 item 1', 'row 1 item 2', 'row 1 item 3'],
      dividerAfter: false,
    },
    {
      cells: ['row 2 item 1', 'row 2 item 2', 'row 2 item 3'],
      dividerAfter: true,
    },
    {
      cells: ['row 3 item 1', 'row 3 item 2', 'row 3 item 3'],
    },
  ],
  buttons: new Button({
    title: 'Button Title',
    url: 'https://github.com/actions-on-google'
  }),
}))

Hierarchy

Implements

Constructors

Properties

Constructors

constructor

  • Parameters

    Returns Table

Properties

Optional buttons

buttons: GoogleActionsV2UiElementsButton[]

Buttons. Currently at most 1 button is supported. Optional.

Optional columnProperties

columnProperties: GoogleActionsV2UiElementsTableCardColumnProperties[]

Headers and alignment of columns.

Optional image

image: GoogleActionsV2UiElementsImage

Image associated with the table. Optional.

Optional rows

rows: GoogleActionsV2UiElementsTableCardRow[]

Row data of the table. The first 3 rows are guaranteed to be shown but others might be cut on certain surfaces. Please test with the simulator to see which rows will be shown for a given surface. On surfaces that support the WEB_BROWSER capability, you can point the user to a web page with more data.

Optional subtitle

subtitle: undefined | string

Subtitle for the table. Optional.

Optional title

title: undefined | string

Overall title of the table. Optional but must be set if subtitle is set.

Generated using TypeDoc