hz-ngjs-types

The different types that are shared between various AngularJS libraries that has been created for Hertz.

Example of custom types

• status
  • Custom status-type. See more information below
• twoDimension
  • A value that exist within another object. See more information below
• date
  • MUST be a JavaScript date-object

Status information and example

Requirement: A status must include the following keys: title and labelClass

Optional: Add the extraText-key to the status-object to show a text below the label

A status will have a "label-icon" with text in it, and can have an extra-text below the "icon".

The labelClass will be appended to Bootstrap's label-. See which values that are available here: Labels

<hz-table hz-table-options="demo.tableOptions" hz-table-data="{{ demo.exampleData }}"></hz-table>

// Note that the title is an empty string. This means that it won't be shown in the column-toggler
const headers = {
    status1: {title: '', visible: true, type: hzTableTypes.status, order: 0},
    status2: {title: '', visible: true, type: hzTableTypes.status, order: 1}
};

const demo = {};
demo.tableOptions = {
    headers: headers
};
demo.exampleData = [
    {
        status1: {
            title: 'STATUS',
            labelClass: 'primary'
        },
        status2: {
            title: 'STATUS WITH TEXT',
            labelClass: 'warning',
            extraText: 'Extra text below the label'
        }
    }
];

Two-dimension information and example

Requirement: Must follow the convention: key__subKey

<hz-table hz-table-options="demo.tableOptions" hz-table-data="{{ demo.exampleData }}"></hz-table>

const headers = {
    key1__subKey1: {title: 'Sub title 1', visible: true, type: hzTableTypes.twoDimension, order: 0}
};

const demo = {};
demo.tableOptions = {
    headers: headers
};
demo.exampleData = [
    {
        key1: {
            subKey1: 'This will be shown below the header with title "Sub title 1"'
        }
    }
];