Pass JS object through angularjs binding

Question

I want to pass a object containing multiple string values to another component using angularjs bindings.

const personName = {
    firstName: this.conversation.customer.firstName,
    lastName: this.conversation.customer.lastName
};

const template = `
    <register-task-popup
        chat-contact-info='${personName}'
    ></register-task-popup>`;

this.$mdDialog.show({
    template,
    targetEvent: null,
    clickOutsideToClose: false
});

In my registerTaskPopUpComponent I have:

selector: 'register-task-popup',
bindings: {
    chatContactInfo: '<'
}

private chatContactInfo: any;

public async $onInit() {
    console.log(this.chatContactInfo);
}

When I run the code the console only logs:

angular.js:15567 Error: [$parse:ueoe] Unexpected end of expression: [object

I'm not sure what's causing the error.

Does this answer your question? angular material load angularjs 1.5 component into $mdDialog — Kaustubh Khare
– Kaustubh Khare, Commented Dec 10, 2019 at 9:00

georgeawg · Accepted Answer · 2019-12-10 11:09:10Z

1

Use:

const personName = {
    firstName: this.conversation.customer.firstName,
    lastName: this.conversation.customer.lastName
};

const template = `
    <register-task-popup
        chat-contact-info='${JSON.stringify(personName)}'
    ></register-task-popup>`;

this.$mdDialog.show({
    template,
    targetEvent: null,

Because [object object] does not parse well.

answered Dec 10, 2019 at 11:09

georgeawg

49k13 gold badges78 silver badges98 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Pass JS object through angularjs binding

1 Answer 1

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Linked

Related