ContentResolver

import {ContentResolver} from 'cx/widgets';

ContentResolver is used when the contents that needs to be displayed is unknown at build time, depends on the data or needs to be lazy loaded.

Controller Code

<table controller={PageController}>
    <tbody>
        <Repeater records-bind="$page.items">
            <tr>
                <td>
                    <Select value-bind="$record.type" style="width: 120px">
                        <option value="textfield">TextField</option>
                        <option value="datefield">DateField</option>
                        <option value="checkbox">Checkbox</option>
                        <option value="switch">Switch</option>
                    </Select>
                </td>
                <td>
                    <ContentResolver
                        params-bind="$record.type"
                        onResolve={type => {
                            switch (type) {
                                case 'textfield':
                                    return <cx><TextField value-bind="$record.text"/></cx>;

                                case 'datefield':
                                    return <cx><DateField value-bind="$record.date"/></cx>;

                                case 'checkbox':
                                    return <cx><Checkbox value-bind="$record.checked"/></cx>;

                                case 'switch':
                                    return <cx><Switch value-bind="$record.checked"/></cx>;

                                default:
                                    return null;
                            }
                        }}
                    />
                </td>
            </tr>
        </Repeater>
    </tbody>
</table>

Copied!Cx Fiddle

Configuration

Property	Description	Type
loading	Writable loading indicator binding. Used only if `onResolve` returns a promise. The provided binding is set to `true` while loading is in progress. After the promise is resolved, the binding is set to `false`.	boolean
onResolve	Callback function taking `params` and returning a widget configuration or a promise.	callback
params	Parameter binding. If `params` change, the content is recreated.	value/object
items children	List of child elements.	array
layout	Define an inner layout.	string/object
mode	One of `replace`, `prepend` or `append`. Determines how resolved content is combined with the content provided as children. Default is `replace`.	string
outerLayout	Defines the outer layout which wraps the widget.	widget
plainText	Set to `true` to avoid converting inner strings to templates. Default is `false`.	boolean
preserveWhitespace ws	Keep whitespace in text based children. Default is `false`. See also `trimWhitespace`.	boolean
putInto contentFor	Used with outer layouts. Specifies the name of the content placeholder which should render the widget.	string
trimWhitespace	Remove all whitespace in text based children. Default is `true`. See also `preserveWhitespace`.	boolean
vdomKey	Key that will be used as the key when rendering the React component.	string
visible if	Visibility of the widget. Defaults to `true`.	boolean

Documentation

ContentResolver