Added IgniteObject to support full end to end properties.

This commit is contained in:
2021-05-25 22:27:23 -07:00
parent 67b4bd60a0
commit d6142ea250
3 changed files with 104 additions and 60 deletions

View File

@ -1,4 +1,4 @@
import { IgniteProperty } from './ignite-html.js';
import { IgniteObject, IgniteProperty, IgniteRenderingContext } from './ignite-html.js';
import { IgniteElement } from './ignite-element.js';
/**
@ -318,28 +318,27 @@ class IgniteTemplate {
/**
* Adds a set of properties from an object to be added to this template once it's constructed.
* @param {Object} props The object value that property names/values will be pulled from.
* @param {Object|IgniteObject} props The object value that property names/values will be pulled from.
* @returns This ignite template so function calls can be chained.
*/
properties(props) {
IgniteRenderingContext.push();
//Make sure we have a valid props.
if (props == null || props == undefined) {
return;
}
if (!(typeof props === 'object')) {
else if (!(typeof props === 'object')) {
throw `Cannot set properties with a non object set of properties: ${props}`;
}
var propNames = Object.keys(props);
if (props instanceof IgniteObject) {
props.update();
propNames.forEach(name => {
this.property(name, props[name], false, null);
});
Object.getOwnPropertyNames(props).forEach(name => this.property(name, props[name], true));
}
else {
Object.keys(props).forEach(name => this.property(name, props[name], false, null));
}
IgniteRenderingContext.pop();
return this;
}
@ -907,7 +906,8 @@ class IgniteTemplate {
for (var i = 0; i < keys.length; i++) {
this.element[keys[i]] = this._properties[keys[i]].value;
if (this._properties[keys[i]].reflect != null) {
//Reflect the property if it can be on the element.
if (this._properties[keys[i]].reflect != null && this.element[keys[i]] instanceof IgniteProperty) {
this.element[keys[i]].reflected.push(this._properties[keys[i]].reflect);
}
}
@ -1136,7 +1136,13 @@ class IgniteTemplate {
if (this.element) {
//Use the set value function and don't reflect the change because it came from above which
//would be the reflected property, this reduces some functions being called twice that don't need to be.
this.element[`_${propertyName}`].setValue(newValue, false);
IgniteRenderingContext.enter();
if (this.element[propertyName] instanceof IgniteProperty) {
this.element[propertyName].setValue(newValue, false);
} else {
this.element[propertyName] = newValue;
}
IgniteRenderingContext.leave();
}
this._properties[propertyName].value = newValue;