pfTableView-Basic

directive in module patternfly.table

Optional configuration object

• .selectionMatchProp - (string) Property of the items to use for determining matching, default is 'uuid'
• .onCheckBoxChange - ( function(item) ) Called to notify when a checkbox selection changes, default is none
• .itemsAvailable - (boolean) If 'false', displays the Empty State component.
• .showCheckboxes - (boolean) Show checkboxes for row selection, default is true

Optional angular-datatables DTOptionsBuilder configuration object. See angular-datatables: DTOptionsBuilder

Array of items to display in the table view.

Array of table column information to display in the table's header row and optionaly render the cells of a column.

• .header - (string) Text label for a column header
• .itemField - (string) Item field to associate with a particular column.
• .templateFn - (function(value, item)) (optional) Template function used to render each cell of the column. Pro: more performant than htmlTemplate. Con: doesn't support AngularJS directives in the template, therefore it doesn't support things like ng-click. Example:

  templateFn: (value, item) => `<a href="${item.id}">${value}</a>`

• .htmlTemplate - (string) (optional) id/name of an embedded ng/html template. Pro: supports AngularJS directives in the template. Con: poor performance on large tables. Ex: htmlTemplate="name_template.html". The template will be used to render each cell of the column. Use handleColAction(key, value) in the template to call the colActionFn callback function you specify. 'key' is the item attribute name; which should equal the itemFld of a column. 'value' is the item[key] value.

      <script type="text/ng-template" id="name_template.html">
        <a href="" ng-click="$ctrl.handleColAction(key, value)">{{value}}</a>
      </script>
    

• .colActionFn - (function) (optional) Callback function used for the column. 'value' is passed as a paramenter to the callback function.

Tip: For templating, use tempateFn unless you really need to use AngularJS directives. templateFn performs better than htmlTemplate.

List of action buttons in each row

• .name - (String) The name of the action, displayed on the button
• .title - (String) Optional title, used for the tooltip
• .actionFn - (function(action)) Function to invoke when the action selected

List of actions for dropdown menu in each row

• .name - (String) The name of the action, displayed on the button
• .title - (String) Optional title, used for the tooltip
• .actionFn - (function(action)) Function to invoke when the action selected

Optional configuration settings for the empty state component. See the Empty State component

Optional buttons to display under the icon, title, and informational paragraph in the empty state component. See the Empty State component