Johan
May 24, 2018, 2:47am
1
@inject has a static member so that you don’t have to use a decorator.
is there a way to the the same with bindable so that you don’t have to use @bindable but instead use a static member or something to that gives you the same end result?
something like perhaps
static bindable() { return [this.field1, this.field2]; }
Recently merged PR https://github.com/aurelia/templating/pull/614 will do what you want. It will take a while to release though.
Johan
May 25, 2018, 9:51am
3
That sounds great, got a quick question and you need to forgive my ignorance here please.
Instead of using@bindable propertyName
Would using getters and setters give me the same result from an aurelia perspective?
get propertyName()
If from a aurelia perspective it flows the same throw the notification layers and binding then I can handle the changed function myself in the setter
That’s essentially what @bindable and @obersvable do under the hood. They patch the descriptor for propertyName with customised get/set functions.
import {_hyphenate} from './util';
import {BehaviorPropertyObserver} from './behavior-property-observer';
import {bindingMode} from 'aurelia-binding';
import {Container} from 'aurelia-dependency-injection';
import {metadata} from 'aurelia-metadata';
function getObserver(instance, name) {
let lookup = instance.__observers__;
if (lookup === undefined) {
// We need to lookup the actual behavior for this instance,
// as it might be a derived class (and behavior) rather than
// the class (and behavior) that declared the property calling getObserver().
// This means we can't capture the behavior in property get/set/getObserver and pass it here.
// Note that it's probably for the best, as passing the behavior is an overhead
// that is only useful in the very first call of the first property of the instance.
let ctor = Object.getPrototypeOf(instance).constructor; // Playing safe here, user could have written to instance.constructor.
let behavior = metadata.get(metadata.resource, ctor);
if (!behavior.isInitialized) {
behavior.initialize(Container.instance || new Container(), instance.constructor);
show original
export function observable(targetOrConfig: any, key: string, descriptor?: PropertyDescriptor) {
function deco(target, key, descriptor, config) { // eslint-disable-line no-shadow
// class decorator?
const isClassDecorator = key === undefined;
if (isClassDecorator) {
target = target.prototype;
key = typeof config === 'string' ? config : config.name;
}
// use a convention to compute the inner property name
let innerPropertyName = `_${key}`;
const innerPropertyDescriptor: PropertyDescriptor = {
configurable: true,
enumerable: false,
writable: true
};
// determine callback name based on config or convention.
const callbackName = (config && config.changeHandler) || `${key}Changed`;
show original