Creating a slug system with Strapi, Angular and GraphQl

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 generatebold textd 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!