2017-09-09 4 views
0

Ich konnte die Ergebnisse meiner Abfrage abrufen, aber ich kann sie nicht auf meine Vorlage übertragen.Wie schiebe ich die Ergebnisse einer ParseQuery auf meine Vorlagenattribute in JavaScript?

BlogApp.Views.Blog = Parse.View.extend({ 
    template: Handlebars.compile($('#blog-tpl').html()), 
    className: 'blog-post', 

    render: function() { 
     var self = this, 
      attributes = this.model, 
      query = new Parse.Query(BlogApp.Models.Blog); 
     query.include("author"); 

     attributes.loggedIn = Parse.User.current() != null; 
     if (attributes.loggedIn) { 
      attributes.currentUser = Parse.User.current().toJSON(); 
     } 

     console.log(attributes.objectId); 

     var Post = Parse.Object.extend("Post"); 
     var commentsQuery = new Parse.Query(Post); 
     commentsQuery.equalTo("senderParseObjectId", attributes.objectId); 
     commentsQuery.find({ 
      success: function(comments) { 
       console.log(comments); 
      } 
     }); 

     attributes.comment = $comments; 
     this.$el.html(this.template(attributes)); 

    } 

}); 

Vorlage:

<script id="blog-tpl" type="text/x-handlebars-template"> 

    {{#if comment}} 
    <div class="blog-sec"> 
     <br><br> 
     <h2>Comments</h2><br> 
     <ul class="blog-comments list-unstyled"> 
      {{#each comment}} 
      <li class="blog-comment"> 
       <table> 
        <tr> 
         <td width="7.5%" style="vertical-align: middle;"> 
          <a href="#/{{author.username}}"><img onError="this.src='images/ic_anonymous.png';" src="{{secureUrl author.profilePicture.url}}" class="profilePictureComments hvr-pulse-grow" id="profilePicture"></a> 
         </td> 
         <td width="auto" style="vertical-align: middle;"> 

          <div><a href="#/{{author.username}}">@{{author.username}}</a></div> 
          <div>{{notificationText}}</div> 
          <div style="color: #a3a3a3;">{{time}}</div> 
          {{#if image.url}} 
          <a class="view" href="{{secureUrl image.url}}"><img class="hvr-pulse-grow profilePicture" src="{{secureUrl image.url}}" style="vertical-align: middle; width: 200px; height: 150px; border-radius: 33px;"></a> 
          <br> {{/if}} 

         </td> 
        </tr> 
       </table> 


       <hr> 
      </li> 
      {{/each}} 
     </ul> 
    </div> 
    {{/if}} 

</script> 

Wie kann ich die Kommentare machen, die ich abgefragt habe?

Router:

BlogApp.Router = Parse.Router.extend({ 

    start: function() { 
     Parse.history.start({ 
      root: '/beta/' 
     }); 
    }, 

    routes: { 
     '': 'index', 
     'post/:url': 'blog', 
     'admin': 'admin', 
     'login': 'login', 
     'store': 'store', 
     'reset': 'reset', 
     'logout': 'logout', 
     'add': 'add', 
     'register': 'register', 
     'editprofile': 'editprofile', 
     'changeprofilepic': 'changeprofilepic', 
     ':username': 'userprofile' 
    }, 

    blog: function(url) { 
     BlogApp.fn.setPageType('blog'); 
     BlogApp.query.blog.equalTo("objectId", url).find().then(function(blog) { 
      var model = blog[0]; 
      var author = model.get('author'); 
      model = model.toJSON(); 
      model.author = author.toJSON(); 

      BlogApp.fn.renderView({ 
       View: BlogApp.Views.Blog, 
       data: { 
        model: model, 
        comment: $comments 
       } 
      }); 

      BlogApp.blog = blog[0]; 
     }); 
    }, 

}); 

Ich verwende <script src="js/parse-1.2.19.js"></script> in Kombination mit http://handlebarsjs.com/ die Daten von Parse meiner Ansichten abgerufen zu machen. Dies ist eine einseitige Anwendung.

Antwort

1

Parsen nicht zu gut, aber es sieht so aus, als müssten Sie die Vorlage innerhalb des Success-Handlers Ihrer asynchronen Suchanforderung rendern - andernfalls hätte sie nicht auf dieses Ergebnis gewartet und stattdessen die Attributdaten abzüglich der Ergebnisse Ihrer Suche gerendert Anfrage

BlogApp.Views.Blog = Parse.View.extend({ 
    template: Handlebars.compile($('#blog-tpl').html()), 
    className: 'blog-post', 

    render: function() { 
    var self = this, 
     attributes = this.model, 
     query = new Parse.Query(BlogApp.Models.Blog); 
    query.include("author"); 

    attributes.loggedIn = Parse.User.current() != null; 
    if (attributes.loggedIn) { 
     attributes.currentUser = Parse.User.current().toJSON(); 
    } 

    console.log(attributes.objectId); 

    var Post = Parse.Object.extend("Post"); 
    var commentsQuery = new Parse.Query(Post); 
    commentsQuery.equalTo("senderParseObjectId", attributes.objectId); 
    commentsQuery.find({ 
     success: function(comments) { 
      console.log(comments); 
      attributes.comment = comments; 
      self.$el.html(self.template(attributes)) 
     } 
    }); 

    } 

}); 
+0

Sinn macht. Aber wie man das ohne "Uncaught TypeError" macht, ist das heikle Bit. – santafebound

+0

der Umfang von "dies" braucht, kümmert sich um –

+0

Das funktioniert! Bring dies in den Rahmen des Erfolgs Callback wie du gesagt hast. – santafebound

Verwandte Themen