Quantcast
Channel: Ember.JS - Latest topics
Viewing all articles
Browse latest Browse all 4826

How to use one template for creating routes

$
0
0

@Nar_Zantaria wrote:

Hello! I work with a simple graphql project using ember-apollo. I fetch a list of docs in the ‘news’ route using a graphql query:

The listing of news.js:

import Route from '@ember/routing/route';
import { queryManager } from 'ember-apollo-client';
import gql from 'graphql-tag';

const query = gql`
  query {
    heroes {
      _id
      title
      description
      date
    }
  }
`;

export default Route.extend({
  apollo: queryManager(),
  model() {
    console.log(this.apollo.watchQuery({ query }, 'heroes'));
    return this.apollo.watchQuery({ query }, 'heroes');
  }
});

news.hbs:

<div class="container">
  <div class="flex-bet">
    <h3>News</h3>
    {{#link-to "addpost"}}
      <button class="xbutton">Create</button>
      {{/link-to}} 
  </div>   
  {{#each model as |item|}}
  <div class="row">
    <div class="col s11 m11 l11">
      <h5>{{item.title}}</h5>            
    </div>
    <div class="col s1 m1 l1">
      <h5>
        <i class="material-icons">list</i>
      </h5>
    </div>
  </div>  
  {{/each}}
</div>

The responce from graphql query looks like:

{
  "data": {
    "heroes": [
      {
        "_id": "5db31d0c5419031a7c8d749c",
        "title": "qqqqqqqqqqqqqqq",
        "description": "ljlkjlkjlkj",
        "date": "1572019076651"
      },
      {
        "_id": "5db331e25419031a7c8d749d",
        "title": "gfdhgfdgfdgfdhg",
        "description": "mnfgdhgfdhgfdhgf",
        "date": "1572019076651"
      },
      {
        "_id": "5db332405419031a7c8d749e",
        "title": "uiyoiuyiuyiuyoiu",
        "description": "ooiuoupoiupoiuoi",
        "date": "1572019076651"
      }
    ]
  }
} 

I have to wrap each post at the news.hbs in a link(_id) to the post. The post route/template should contain the data of it’s document:

Here should be the title
The description
Date

How to use the post template for dynamic routing with a correct data? Thanks in advance!

Posts: 1

Participants: 1

Read full topic


Viewing all articles
Browse latest Browse all 4826

Trending Articles