CODEWITHSUNDEEP
arraysbindingember.jshandlebars.js
JJJ
JJJ

Reputation: 2899

Handlebars array binding not updating using ember framework

I'm adding items to an array and displaying them using handlebars. However, changes are not shown after an item is added to the array. How can I fix this?

handlebars code:

{{#each person in addNewPersonController.child}}
        {{#if person}}
            {{#view Blocks.TimelinePersonView personBinding=person}}
                <p class="inline pull-left" style="position:relative; top:55px; left:5px;">{{person.firstName}} </p>
                <i class=" icon-cog pull-right" style="position:relative; top:-45px; left:40px;" {{action modifyPerson person target="controllers.modifyPerson"}}></i>
            {{/view}}
        {{/if}}
    {{/each}}

controller code:

addPerson: function() {
        var people = this.get('content');
        this.propertyWillChange("content");
        people.child.push(Em.Object.create({
            id: people.child.length + 1,
            firstName: this.get("firstName"),
            lastName: this.get("lastName"),
            birthday: new Date(),
            gender: this.get("gender")}));
        this.propertyDidChange("content");
        this.clearFields();
        $("#addPersonPopup").modal("hide");
    }

Upvotes: 1

Views: 313

Answers (1)

Kingpin2k
Kingpin2k

Reputation: 47367

use people.child.pushObject(..., and no need to call proprtyDidChange

Upvotes: 3

Related Questions