Angular pattern generation – Unable to get desired output

I have the following problem, I have tried in several ways, but still I am getting the below output, but my desired output is different. Can anyone of you please check and let me know where I am doing wrong and how to achieve the desired output pattern.
I have an input number(n). The input value should be between 2 and 10. We need to validate if the input value is not in expected range.

I am getting the below output:

if I enter n = 2:

A

B C

if I enter n = 3:

A

B C 

D E F

But my desired outputs are like below:

Example 1. if I give n = 3 in the input field, then we need to show the below output:

A

A B

C D E

Example 2: if I give n = 4 in the input field, then we need to show the below output:

A

A B

A B C

D E F G

Created Stackblitz