mdtCell

Description

Representing a cell which should be placed inside mdt-row element directive.

Dependencies

Usage

as element:
<mdt-cell
       [html-content="{boolean}"]
       [editable-field="{string}"]
       [editable-field-title="{string}"]
       [editable-field-max-length="{number}"]>
</mdt-cell>

Parameters

ParamTypeDetails
htmlContent
(optional)
boolean

if set to true, then html content can be placed into the content of the directive.

editableField
(optional)
string

if set, then content can be editable.

 Available modes are:

 - "smallEditDialog" - A simple, one-field edit dialog on click
 - "largeEditDialog" - A complex, flexible edit edit dialog on click
editableFieldTitle
(optional)
string

if set, then it sets the title of the dialog. (only for largeEditDialog)

editableFieldMaxLength
(optional)
number

if set, then it sets the maximum length of the field.

Example

<mdt-table>
    <mdt-header-row>
        <mdt-column>Product name</mdt-column>
        <mdt-column>Price</mdt-column>
        <mdt-column>Details</mdt-column>
    </mdt-header-row>

    <mdt-row ng-repeat="product in ctrl.products">
        <mdt-cell>{{product.name}}</mdt-cell>
        <mdt-cell>{{product.price}}</mdt-cell>
        <mdt-cell html-content="true">
            <a href="productdetails/{{product.id}}">more details</a>
        </mdt-cell>
    </mdt-row>
</mdt-table>