Wiki
Clone wikiExtJSPackages / Escaped binds
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'
##How to install##
Install the package:
#!bash
$ sencha repo add alfonsonishikawa https://alfonsonishikawa.bitbucket.io/extjspackages/pkgs
$ sencha package install nishilua-escaped-binds
app.json
:
#!json requires: [ .... , "nishilua-escaped-binds" ],
#!bash
$ sencha app watch
##Compatibility##
- ExtJS 6.0.1.250
- ExtJS 6.2.0.981
Updated