Wiki

This package allows bind expressions with escaped characters. Additionally, it has fixes to allow binding array items by index.

Released under GPLv3.

The main motivation for this package was the retrieval of data from NoSQL stores where some maps' keys where URLs.

In binds definitions you can only escape the following characters: ., \, {, }, : and ! when you want them to be part of the binding token. The escape character is \ , but remember that in javascript you have to write \\ in a string to represent a \ (internally it gets stored as one \).

Using 6.2.0.981, the characters (espace) and ( must be escaped too.

You can have a ViewModel with data like:

#!javascript

Ext.define('My.greatModel', {
    extends: 'Ext.view.ViewModel',

    data: {
        'http://www.google.com': 'stuffHere', //Don't need to scape keys in the ViewModel
        'other\\th}ing': 'more stuff', // In javascript, a backslash in a text must be scaped: '\\' = '\'
                                       // and the key here is 'other\th}ing'
        'id.number': 23
    }
});

and define binds to that keys. For example:

#!javascript

bind: '{http\\://www\\.google\\.com}' // Escaped dots of the URL means they are a single key token
bind: '{other\\\\th\\}ing}'   // Notice the double-escape needed by javascript (equals to) '{other\\th\}ing}'
                              // that will match the key 'other\th}ing' in the ViewModel

You can bind templates too:

#!javascript

bind: 'The value of \\{x\\} is {x}.' // Only the last {x} is a binded token. the former is escaped and will
                                     // be shown as: "The value of {x} is blahblahblah."
                                     // Remember to double escape backslashes in javascript strings
                                     // in your code.
bind: 'And with {foo\\:bar:number(5,1)}' // the key is 'foo:bar', so we have to escape the colon to
                                         // disambiguate from the format

You can make deep bindings too:

#!javascript

bind: '{user.id\\.number.exists}' // where the keys in the ViewModel are: 'user', 'id.number' and 'exists'

Maybe you need to create at runtime a token for a bind. For that, Ext.String is overriden to have a escaping method. You can escape a subexpression and concatenate it before binding:

#!javascript

VM:

data: {
    token: {
        'another.andanother' : value
    }
}

bind: '{token.' + Ext.String.escapeBind('another.andanother') + '}' // = '{token.another\.andanother'

###Example### https://fiddle.sencha.com/#fiddle/1hgt

##How to install##

Install the package:

#!bash
$ sencha repo add alfonsonishikawa https://alfonsonishikawa.bitbucket.io/extjspackages/pkgs
$ sencha package install nishilua-escaped-binds

Add it to your app.json:

#!json
    requires: [
        .... ,
        "nishilua-escaped-binds"
    ],

It will be downloaded automatically when doing:

#!bash
$ sencha app watch

And you can start to use it.

##Compatibility##

ExtJS 6.0.1.250
ExtJS 6.2.0.981