Question

简短说明：

我正在使用<ion-item-option></ion-item-option>。

当我根据ionic2文档创建组件时，它可以正常工作。

但我想将离子组件包装到我的自定义组件中，并附加其他功能，因为在我当前的项目中，相同的组件在任所以它为我创造了问题。

仅在IOS设备中出现问题。 ios screenshots

实施例 我创建了新组件<nl-edit-button></nl-edit-button>

   @Component({
      selector: 'nl-edit-button',
      template: `
        <button ion-button color="edit" (click)="openEditModal(complaint)" *ngIf="complaint.statusId != 6 && complaint.statusId != 4">
          <ion-icon name="md-create"></ion-icon>
          Edit
        </button>
      `
    })

它在Android设备中按预期工作，但在ios中没有。

我正在使用这样的自定义组件：

<ion-item-options side="right">
  <nl-edit-button [complaint]="complaint" (edit)="openEditModal($event)">    </nl-edit-button>
</ion-item-options>

Answer 1

我之前遇到过同样的问题，尝试在样式标记中添加高度。它对我有用。

@Component({
      selector: 'nl-edit-button',
      template: `
        <div style="height:100%">
        <button ion-button color="edit" (click)="openEditModal(complaint)" *ngIf="complaint.statusId != 6 && complaint.statusId != 4">
          <ion-icon name="md-create"></ion-icon>
          Edit
        </button>
        </div>
      `
    })


    <ion-item-options side="right">
      <nl-edit-button style="height:100%" [complaint]="complaint" (edit)="openEditModal($event)">    </nl-edit-button>
    </ion-item-options>

Ionic2组件包装在自定义组件

简短说明：

1 个答案: