Computed Properties ( Proxied )

Create dynamic properties for your UI Wires.

Computed Properties are dynamic properties and help derive values from a database or another persistent store like a cache.

Computed Properties are similar to Data Properties with some key differences:

  • They are declared as inline functions using computed.

  • They can return any CFML value or object.

Defining Properties

Define Computed Properties in your Wires using computed.

component extends="cbwire.models.Component" {

    property name="taskService" inject="taskService@myapp";

    // Computed Properties
    computed = {
        "allTasks": function() {
            return taskService.getAll();
        }
    };
}

Accessing From Actions

You can access your Computed Properties from within your Actions using computed.[propertyName]().

component extends="cbwire.models.Component" {

    // Computed Properties
    computed = {
        "allTasks": function() {
            // return something here
        }
    };

    // Action
    function deleteTasks() {      

        if ( arrayLen( computed.allTasks() ) {
            taskService.deleteAll();
        }

    }
}

Accessing From Templates

You can access Computed Properties in your Template using args.computed.[computedProperty]().

<cfoutput>
<div>
    <ul>
        <cfloop array="#args.computed.allTasks()#" index="task">
            <li>#task#</li>    
        </cfloop>
    </ul>
</div>
</cfoutput>

Last updated

Was this helpful?