Hi,
smart-model is compatible with sub-property binding and we have demo about that: https://www.htmlelements.com/demos/framework/sub-property-binding/.
It is also possible to dynamically add additional objects to app.data.
For example:

window.onload = function() {
	const app = new Smart.App(
		{
			data: {
				details: {
					subject: "About Transaction",
					message: "Hey, Peter. Take a look at the items, I sent you earlier."
				}						
			}
		}
	)		
  
  app.data.test = 'test';
}

HTML

	<div class="demo-description">
	TextBox and MultilineTextBox are bound to sub properties. 
	</div>
	<br/>
	<smart-text-box smart-model="details.subject" id="textBox1"></smart-text-box>	<br/><br/>
	<smart-multiline-text-box  smart-model="details.message" id="textBox2"></smart-multiline-text-box>	
	<br/>	
	<span>{{details.subject}}</span>
	<br/>	
	<span>{{details.message}}</span>
	<span>{{test}}</span>

Demo: https://codepen.io/boyko-markov/pen/NWWvBRx?&editable=true
If it is array and you add it like that:

 app.data.array = ['hi', 'bye'];

in HTML you can refer it like that:

	<span>{{array.0}}</span>

Best Regards,
George
Smart HTML Elements Team
https://www.htmlelements.com

Hi Starlight Sparkle,
Injecting spans into body is OK, if it is in the APP’s context. Otherwise, they won’t be rendered, as they are outside the App. Please, refer to the examples in the Framework demo section(ex: https://www.htmlelements.com/demos/framework/data-binding/) and the code we posted here in order to get the desired results.
Best Regards,
George
Smart HTML Elements Team
https://www.htmlelements.com