# Data binding of objects not working in modular window

#1

Hi guys,

with ionic 2 rc my code worked, but actually after updating to ionic 4 it’s not working anymore.
Although the constructor of the modalPage is executed and all objects/ variables were set before, when loading the HTML file, I get the error _TypeError: Cannot read property ‘value’ of undefined for the object/model.

Please see the simplified example below.
Any idea, why the variable work but objects are not possible to access in this case?

Modal window creation

`````` this.modal = this.modalCtrl.create(ModalPage);
this.modal.present().then(() => { ...}
``````

ModalPage.ts file

``````export class ModalPage {
value;
counter;

constructor(public someProvider...) {
this.someProvider.getNumber("count").subscribe((data) => {
this.value= { text: 'hallo' };
this.counter = 1;

}
``````

ModalPage HTML File

``````{{counter}} \\ works
{{value.text}} \\ does not work
``````

#2

Is that really the error? If it is, is value really on the left side of the dot in the template, as opposed to the right side (where `text` is in your “simplified” code)?

#3

Unfortunately not, variables work fine! Even if I write only {{value}}, I get [object Object] written in the UI. But when I then try to access some properties like in this case text, the error (ERROR Error: Uncaught (in promise): TypeError: Cannot read property ‘text’ of undefined) occurs.

#4

Then you have wasted everybody’s time. Next time post actual errors and actual code.

That’s because you have not initialized the surrounding instance variable. I prefer to do so at the point of declaration:

``````value: Whatever = {};
``````