Javascript 如何使用dev extreme标记框创建类别和子类别？

我需要在dx标记框中创建类别和子类别

这是一个什么样的例子

类别

早餐

午餐

早餐、鸡蛋、意大利面的子类别

午餐肉子类别

<dx-tag-box 
[items]="filteredRecipe" 
displayExpr="name" 
valueExpr="id" 
[showSelectionControls]="true"   
(onSelectionChanged)="recipeSelected($event)" 
required 
applyValueMode="useButtons"> 
</dx-tag-box> 

我需要在这里添加一些类别，然后根据这些类别列出这些食谱

mealType是它们属于哪个类别的值

示例：如果mealTypes=0，则为早餐

如果mealTypes=1，则为lounch

如果mealTypes=3，则为晚餐

mealTypes是值的数组

因此，如果配方包含0和1，则它同时属于类别0和类别1。早餐和午餐

 [ 
       { 
          "name":"Testen", 
          "description":"", 
          "difficulty":3, 
          "preparationTime":240, 
          "ingredients":[ 
             "sestavino",
             "test" 
          ], 
          "instructions":[ 
             "inst" 
          ], 
          "pictureUrl":"https://www.url.com/images/aca27231f9af4ed0af5e1ec4af09861e.jpg", 
          "recepieType":"", 
          "mealTypes":[ 
             0, 
             2 
          ], 
          "id":282 
       }, 
       { 
          "name":"Milk", 
          "description":"", 
          "difficulty":2, 
          "preparationTime":2580, 
          "ingredients":[ 
             "ddd" 
          ], 
          "instructions":[ 
             "das", 
             "dasd" 
          ], 
          "pictureUrl":"https://www.url.com/images/1fd0bd88175a4680ae9430579f1b781c.jpg", 
          "recepieType":"", 
          "mealTypes":[ 
             1 
          ], 
          "id":283 
       }, 
       { 
          "name":"test", 
          "description":"", 
          "difficulty":4, 
          "preparationTime":240, 
          "ingredients":[ 
             "jajca", 
             "meso" 
          ], 
          "instructions":[ 
             "rf" 
          ], 
          "pictureUrl":"https://www.url.com/images/0fafcd552354468bbca3a78cb9796004.jpg", 
          "recepieType":"", 
          "mealTypes":[ 
             0, 
             2 
          ], 
          "id":211 
       } 
    ]