html - 无法将标题对齐到左侧

Question

我这里有一个演示页面DemoPage我正在尝试创建一个这样的。此页面将在可编辑时从后端获取动态数据。所以我在这里创建的是这个页面 CreatedPage .每个段落上方的标题需要在左侧，而段落和图片将在每次迭代时反转。我无法固定每个段落上方左侧的标题。我有一个对齐属性，根据该对齐属性，每次迭代时每一行都会被反转，为此我使用了类绑定(bind)。另外，现在该段落与图片不一致。这对我来说变得非常困难。我怎样才能使标题保持在左侧，同时确保段落和图片保持内联并在每次迭代时保持反转？请检查此 stackblitz 网站上的代码 PageCreated

Answer 1

我想你只是不想嵌套标题？试试这个:

<h1>App Comp</h1>
<section>
  <div *ngFor="let item of data; even as isLeft" >
    <h4>{{ item.heading }}</h4>
    <div class="card-item" [class.paraRight]="isLeft">
      <div class="image-container">
      <img [src]="item.image">
      </div>
      <div class="desc-container">
        <p>{{ item.paragraph }}</p>
      </div>
    </div>
  </div>
</section>