localClassNameBindings only works with boolean values

[max]

Here is an example app where localClassNameBindings aren't being prefixed:

max/e-css-localclassbindings-bug@ab9e542

Possible that it's because of Ember/Ember CLI beta:

[Debug] DEBUG: -------------------------------
[Debug] DEBUG: Ember      : 2.9.1
[Debug] DEBUG: Ember Data : 2.9.0
[Debug] DEBUG: jQuery     : 3.1.1
[Debug] DEBUG: -------------------------------

[dfreeman]

Unfortunately this is working as expected, though the README dances around the issue a little 😞

Currently localClassNameBindings only works for toggling classes based on a boolean value. Mapping string values basically requires one more layer of indirection than you can package up in a single computed, since the name of the property you're binding to in turn depends on a dynamic property value.

It's possible we may be able to come up with a way around this by manually Ember.binding things on init, but we should be careful of the perf costs of setting up these extra bindings. Will need to noodle on it some.

[dfreeman]

Actually, it looks like the README lies and says strings will be coerced and treated as booleans, which clearly isn't the case. I'll update that for the time being to be clearer(/actually accurate).

[luxzeitlos]

Cant we just do something like this:

  init() {
    this._super(...arguments);
    const names = get(this, 'localClassNameBindings');
    get(this, 'classNameBindings').pushObject('__local_class_names');
    set(this, '__local_class_names', Ember.computed(...names, function() {
      return names
        .map(n => get(this, n)) // get property value
        .map(c => c.split(' ')) // get array of array of classes
        .reduce((a, b) => [...a, ...b]) // flatten to array of classes
        .map(v => styles[v]) // get local class name
        .filter(s => s) // remove non-existring
        .join(' ');
    }));
  },

[dfreeman]

Fixed by #81