title: Angular 8 mapping unknown amount of object keys into model
body: <p>I am trying to create a model for the following object, specifically <code>GroupedMenu</code>. The categories listed in grouped menu are dynamic, in this case they are burritos and desserts, but in another call it could be pizza, drinks, tacos, enchiladas.</p>
  
  <pre><code>{
      "name": "Taco Taco",
      "address": "123 somewhereville",
      "groupedMenu": {
          "burritos": [
              {
                  "name": "good burrito",
                  "category": "burritos",
                  "price": "1.59$",
                  "description": "It's a burrito, ok?"
              }
          ],
          "desserts": [
              {
                  "name": "cinnamonStick",
                  "category": "desserts",
                  "price": "$5.00",
                  "description": "Cinnamon is healthy, try a spoonful."
              }
          ]
      },
  }
  </code></pre>
  
  <p>Here is how I've formed the model so far:</p>
  
  <pre><code>export interface Restaurant {
      name: string;
      address: string;
      groupedMenu: GroupedMenu;
  }
  
  interface GroupedMenu {
      [key: string]: MenuItem;
  }
  
  export interface MenuItem {
      name: string;
      description: string;
      img: string;
      price: string;
  }
  </code></pre>
  
  <p>This seems to work for my use-case, but I'm not sure if it's the correct implementation.</p>
  
  <p>How should I model <code>GroupedMenu</code> so that it handle a dynamic amount of object keys with unknown names (e.g. burritos, desserts, pasta, sides, somethingRandom). Or is my implementation correct?</p>