Массив данных из ng-repeat в нескольких столбцах и строках, как я могу это сделать?

У меня в руке есть список массивов, я хочу показать этот список массивов с помощью ng-repeat, как на изображении. Как правильно это сделать?

Я хочу сделать следующее, если возможно, на четырех сторонах коробки есть "+". Когда я нажимаю на «+», я хочу, чтобы новые поля создавались в том же направлении, как и количество прямоугольников под ним. Другой вариант - значок удаления в каждом поле. Я хочу, чтобы этот квадрат стирался, когда я нажимаю на них.

Я хочу, чтобы изображение было визуальным.

vm.sections = {
    width: 3,
    matrix: [
      { name: "Left Text", position: "left" },
      { name: "Top Text", position: "top" },
      { name: "Right Text", position: "right" },
      { name: "Left Text", position: "left" },
      { name: "Center", position: "center" },
      { name: "Right Text", position: "right" },
      { name: "Left Text", position: "left" },
      { name: "Bottom Text", position: "bottom" },
      { name: "Bottom Text", position: "bottom" }
    ]
};

<div class = "table">
    <div class = "body">
        <div class = "row" ng-if = "(section.position==='top' || section.position==='bottom' || section.position==='center')"
             ng-repeat = "section in sections.matrix track by $index">
          <div class = "cell section"
               ng-repeat = "section in sections.matrix track by $index">
            {{ section.name }}
          </div>
        </div>
    </div>
</div>