Relational Fields in Strapi

Learn how to manage relational fields with the Strapi admin panel.

We'll cover the following

The relational field

The relational field option can be used to link one content-type to another. A condition of the relation field is the connected content-type must be a collection and not a single type. First, let’s go over the six types of relations that Strapi supports.

Press + to interact
Pop-up for creating a relation in a collection
Pop-up for creating a relation in a collection

In the highlighted area of the image above, there are six clickable boxes. Each of these represents a different relation that we can have between our collections, depending on the use case.

  1. One way: Content-type A has one Content-type B.

  2. One-to-one: Content-type A has and belongs to one Content-type B.

  3. One-to-many: Content-type A belongs to many Content-type B.

  4. Many-to-one: Content-type B has many Content-type A.

  5. Many-to-many: Content-type A has and belongs to many Content-types.

  6. Many way: Content-type A has many Content-type B.

On the left side of these boxes, we can select the field’s name. On the right side, we can select the collection it will have a relationship with.

Creating a relational field

Let’s take a look at how we can create a relational field in Strapi. Let’s continue building our own Recipes application using this concept. We want to allow users to add recipes to their favorites. For that, we’ll create a field named “favorites.” This field will have a many way relationship with “Recipe.” Let’s take a look at the steps to do that:

  1. Click the “Add another field to this collection type” button at the bottom of the list of fields.

  2. Select the field to be of “Relation” type.

  3. Select the collection with which the created field will have a relationship. Select the type of relationship the two fields will have and add the name of the field.

Now that we’ve created the relationship, let’s take a look at how this affects our code:

Note: A Strapi administrator user has already been created for this course. The details of the user are as follows:

  • Email: jane.doe@email.com

  • Password: Password123

'use strict';

module.exports = {
  /**
   * An asynchronous register function that runs before
   * your application is initialized.
   *
   * This gives you an opportunity to extend code.
   */
  register(/*{ strapi }*/) {},

  /**
   * An asynchronous bootstrap function that runs before
   * your application gets started.
   *
   * This gives you an opportunity to set up your data model,
   * run jobs, or perform some special logic.
   */
  bootstrap(/*{ strapi }*/) {},
};
The Strapi application for our Meals app

Here, we can see notice the changes in the /src/api/extensions/users-permissions/content-types/user/schema.json file. This is the file that stores our User content-type. Lines 66–70 show that we have added a new field named “favorites” to the content-type with type: "relation", relation: "oneToMany", and target: "api::recipe.recipe".