dimanche 24 janvier 2016

why directly provided model can not render out the content?

I wrote 2 simple routes---post and comment and suppose the post json api return data like this

{
    "data": {
        "type": "post",
        "id": "1",
        "attributes": {
            "title": "it is the title"
        },
        "relationships": {
            "comments": {
                "data": [
                    {"type": "comment", "id": "5"},
                    {"type": "comment", "id": "12"}
                ]
            }
        }
    }}

and the comment api return

{
    "data": {
        "type": "comment",
        "id": "1",
        "attributes": {
            "content": "yolo!!!"
        }
    }}

and in my client script i wrote some code like this

<script type="text/x-handlebars" id="post">
  {{model.title}}
  {{#each model.comments as |comment|}}
      {{comment.content}}
  {{/each}}
</script>

and in the post route i wrote like this

App.PostRoute=Ember.Route.extend({
  model:function(){
    return this.store.findRecord("post",123);
   }
 })

the post data return correctly,and i got the title message correctly,however,the comment content didn't display out,i noticed the comment api has been called correctly.did i miss something?

that is my question one.

after that i changed my post template code and add a comment template and a comment route

App.CommentRoute=Ember.Route.extend({
    model:function(param){
        return this.store.findRecord("comment",param.id);
    }
})

<script type="text/x-handlebars" id="post">
  {{model.title}}
  <ul>
  {{#each model.comments as |comment|}}
      <li>{{#link-to 'comment' comment}}{{comment.id}}{{/link-to}}</li>
  {{/each}}
  </ul>
</script>

<script type="text/x-handlebars" id="comment">
  {{model.content}}
</script>

while i click that link in post page,even though i jumped to comment page,i still get nothing to display. and i find some clue in the official guide,in the emberjs model description said

Note: A route with a dynamic segment will only have its model hook called when it is entered via the URL. If the route is entered through a transition (e.g. when using the link-to Handlebars helper), then a model context is already provided and the hook is not executed. Routes without dynamic segments will always execute the model hook.

after that i try to change the link code from translate the comment model to the id only

from

{{#link-to 'comment' comment}}{{comment.id}}{{/link-to}}

to

{{#link-to 'comment' comment.id}}{{comment.id}}{{/link-to}}

then everything is peace now,but why? and how to display correctly even i use the upper line code?

that is my second question.

hope some friend can give me some hint,thanks very much




Aucun commentaire:

Enregistrer un commentaire