ZPT-JS reference - Configuration - dictionary

Syntax

dictionary ::= a javascript object
                

Description

The dictionary is used to define global variables; all the variables that you define using the dictionary are available in all the template. It is a javascript object.

Declaring a dictionary is not mandatory, but in practice we always declare it.

A dictionary usually is declared once. You declare at the first invokation of ZPT-JS and ZPT-JS will use the same dictionary the rest of the invokations. A full replace of the dictionary is supported, although is not normal.

A dictionary can be modified by the programmer. Changes will be effective in the template after doing a partial or a full render.

ZPT-JS provides zpt.ReactiveDictionary, a javascript class that defines a dictionary with reactive capabilities: it can detect some type of modifications done to it and invoke an update command. For more details about reactive dictionaries go to reference page.

Examples

An example of fullRender:

import { zpt } from './zpt-esm.js';

var dictionary = {
    aString: "string",
    doggy: false,
    number: 23,
    user: {
        name: "Bob", 
        age: function( ){
            return 25;
        }
    },
    items: [ "item0", "item1", "item2" ]
};

// Parse template
zpt.run({
    root: document.body,
    dictionary: dictionary
});
                

If we invoke ZPT-JS a second time we must not declare the dictionary again. The next code do a full render using the same dictionary:

zpt.run();
                

You can update the dictionary and do a full render:

dictionary.number = 100;
zpt.run();
                

..or you can update the dictionary and do a partial render:

dictionary.number = 100;
zpt.run({
    command: 'partialRender',
    target: [ 
        document.getElementById( 'id1' ), 
        document.getElementById( 'id2' )
    ]
});