dimanche 21 juin 2015

Passing property to component, but property key has dot notation

I have ember.js component to list error messages, see below:

form-field.js

export default Ember.Component.extend({
    errorMessages: null,
});

form-field.hbs

{{#each message in errorMessages}}
    <span class="help-block">{{message}}</span>
{{/each}}

Back-end languages is ASP.NET MVC, controller return JSON format error message,

"errorJson" : {
    "Id" : ["Id is required."],
    "UserName" : ["UserName is required."]
}

Normal, i only use one model binding, call the component in template is works.

{{#form-field errorMessages=errorJson.Id}}
{{/form-field}}

But, when use multi model binding, ASP.NET was return like:

errorJson: {
    "Order.Id": ["Id is required."],
    "Order.UserName": ["UserName is required."],
    "OrderItem[0].ProductId": ["ProductId is required."],
    "OrderItem[0].Quantity": ["Quantity is required."],
    "OrderItem[1].ProductId": ["ProductId is required."],
    "OrderItem[1].Quantity": ["Quantity is required."]
}

It's not works, errorMessages is undefined.

{{#form-field errorMessages=errorJson.Order.Id}}
{{/form-field}}

I try, but still not works.

{{#form-field errorMessages=errorJson[Order.Id]}}
{{#form-field errorMessages=errorJson["Order.Id"]}}

How can i passing errorJson[Order.Id] to component property? Thanks.




Aucun commentaire:

Enregistrer un commentaire