pug でfor文を用いた連番を出す方法を教えてください。

Question

表題の通り、pugでfor文でclass内に展開しようとしてもうまくいきません。
色々調べたんですがうまくいかず、、教えてください><

- var title0 = "ダミーテキスト1";
- var title1 = "ダミーテキスト1";
- var title2 = "ダミーテキスト2";
- var title3 = "ダミーテキスト3";

section#top
  .content.top
  - for (var i = 1; i < 3; i++)
    .block
      h2(class="#{i}") 見出し <- ここがうまくいかない
      p title#{i}
      a(href="#") ボタン

<section id="top">
  <div class="content top"></div>
  <div class="block">
    <h2 class="#{i}">見出し</h2>
    <p>title1</p><a href="#">ボタン</a>
  </div>
  <div class="block">
    <h2 class="#{i}">見出し</h2>
    <p>title2</p><a href="#">ボタン</a>
  </div>
</section>

　理想はこちら

<section id="top">
  <div class="content top"></div>
  <div class="block">
    <h2 class="1">見出し</h2>
    <p>title1</p><a href="#">ボタン</a>
  </div>
  <div class="block">
    <h2 class="2">見出し</h2>
    <p>title2</p><a href="#">ボタン</a>
  </div>
</section>

"gulp-pug": "^4.0.1" を使っています。

Answer 1

https://qiita.com/esnetk6/items/72bfd300657535c52a1d

この記事の通り、"#{}"をはずすか、

`${}`
```でいけそうですね。