Dynamic Zones not retrieving nested components in v4 (REST API)

Questions and Answers
1

Not entirely sure if this is now expected behavior on v4 or if something broke with the new version.

Previously I was able to get all the details from Dynamic Zones and all their inner components. Currently using ?populate=* as described in the docs still only gives me part of the information.

Considering the structure:

Model > Dynamic Zone (blocks) > Component (Topics List)

The only thing I can get from the API looks like this: CleanShot 2021-12-01 at 13.34.06 · CleanShot Cloud

So it seems like the API is populating the top level information for the top level components within the Dynamic Zone, but if any of those components contain a Dynamic Zone of their own that information is not pulled in.

Is this intended behavior or something that broke with this release?

System Information
  • Strapi Version: v4.0.0
  • Operating System: macOS
  • Database: Postgres
  • Node Version: v14.17.1
  • NPM Version: 6.14.13
  • Yarn Version: 1.22.17
3 Likes
2

Hello,

I am having the same issue. Did you find a solution to this?

Thanks

4

Hi there ! Same problem here :neutral_face: . Any update ? (using Strapi 4.0.4)

Here is my components structure :

Capture d’écran 2022-01-13 à 10.32.20
Capture d’écran 2022-01-13 à 10.32.202930×1836 340 KB

:wave:

5

And the response I get from the API :

Capture d’écran 2022-01-13 à 10.33.47
Capture d’écran 2022-01-13 à 10.33.471926×1296 235 KB

6

Found a solution in this post : Strapi V4 populate Media and Dynamiczones from Components - #9 by nextrapi

And here is my controller :

const { createCoreController } = require("@strapi/strapi").factories;

module.exports = createCoreController("api::study.study", ({ strapi }) => ({
  async findOne(ctx) {
    const { id } = ctx.params;
    const { query } = ctx;

    const entity = await strapi.entityService.findMany("api::study.study", {
      ...query,
      populate: {
        blocks: {
          populate: {
            image: true,
            keyNumber: {},
            textImage: { populate: { image: true } },
          },
        },
      },
    });
    const sanitizedEntity = await this.sanitizeOutput(entity, ctx);

    return this.transformResponse(sanitizedEntity);
  },
}));```