Page Comparison

{div:class=floatRight}
{panel:title= On This Page| borderStyle=solid| borderColor=#ccc| bgColor=#fff}
{toc:minLevel=2|maxLevel=5}
{panel}
{div}

Regardless of which grade of component you use, the basic structure will be the same. We'll use the simplest grade, a little component, to illustrate what this structure is. In future pages explaining other grades, you'll see the same principles.

...

1. directly: You write the function yourself
2. using IoC - Inversion of Control (IoC): The framework will create the function according to your specifications

...

Automatic creator function generation

The IoC - Inversion of Control (IoC) system can automatically generate a component creator function for you. This is accomplished by added a special grade to the gradeNames property: "autoInit":

...

fluid.defaults("tutorials.currencyConverterAuto", {
    gradeNames: ["fluid.littleComponent", "autoInit"],
    exchangeRate: 1.035,
    finalInitFunction: "tutorials.currencyConverterAuto.finalInit"
});

// The final init function
tutorials.currencyConverterAuto.finalInit = function (that) {
    that.convert = function (amount) {
        return amount * that.options.exchangeRate;
    }
};