Question

我有ion-list个要包装在ion-item中的食品，每个食品都可以通过三个input字段（名称，数量，单位）进行编辑，此外，我还想在行的左侧删除button。

这些输入在ion-item中显示得很好，但是我无法显示"trash"图标按钮。

如果我删除所有输入，则会显示该按钮。

我该怎么做才能使两者同时出现？可能吗？

这是the人：http://plnkr.co/edit/JvHNEISfUCwcnujDB2jg?p=preview

代码：

<ion-content>

  <ion-list>
    <ion-item>

      <button ion-button icon-only clear small>
        <ion-icon name="trash"></ion-icon>
      </button>

      <ion-input type="text" value="peanut"></ion-input>
      <ion-input type="number" value="1"></ion-input>
      <ion-select>
        <ion-option>oz</ion-option>
        <ion-option>cup</ion-option>
        <ion-option>glass</ion-option>
        <ion-option>piece</ion-option>
      </ion-select>
    </ion-item>

  </ion-list>

</ion-content>

Answer 1

ion-col和ion-row似乎有所帮助，我想知道这是否是正确的方法吗？

<ion-row>

  <ion-col>
    <button ion-button icon-only clear small>
      <ion-icon name="trash"></ion-icon>
    </button>

  </ion-col>

  <ion-col>
    <ion-input type="text" value="peanut"></ion-input>
  </ion-col>
  <ion-col>
    <ion-input type="number" value="1"></ion-input>
  </ion-col>
  <ion-col>
    <ion-select>
      <ion-option>oz</ion-option>
      <ion-option>cup</ion-option>
      <ion-option>glass</ion-option>
      <ion-option>piece</ion-option>
    </ion-select>
  </ion-col>
</ion-row>

与输入结合使用时，按钮在离子项目中不可见

1 个答案: