I am going to explain you step by step guide about how to create a slug system using strapi+Angular+Graphql for any Content Type, for this demonstration I am using the Category Content Type
Step 1: Create a content type Category and add 3 fields name (Text), articles(Relation) and slug(UID) as describe in below images.
Step 2: Attached the Slug attribute with category name attribute so you can regenerate the slug value from category name. as describe in below image
Step 3: Next Goto Categoris collection types and click on Add New Category button to add new Category on typing the Name fields you will notice slug will be generate bold text d based on name fields. click on save button to save the category
Step 4: Now got to your project folder/api/categories/config/ folder and create a flie “schema.graphql.js” and add the below code to this file
const { sanitizeEntity } = require('strapi-utils');module.exports = {query: `categoryBySlug(id: ID slug: String): Categories`,resolver: {Query: {categoryBySlug: {resolverOf: 'Categories.findOne',async resolver(_, { slug }) {const entity = await strapi.services.categories.findOne({ slug });return sanitizeEntity(entity, { model: strapi.models.categories });},},},},};
Step 5: Open the http://localhost:1337/graphql local strapi application graphql URL and write the below query to run the gql Query
query Category($slug: String!) {
categoryBySlug(slug: $slug) {
id
name
slug
articles{
title
}
}
}
I hope this will help you!
Related Articles
Originally published at https://codinghub.net.