イオン2 - イオン入力を含むイオンアイテム内にイオンアイコンを追加できない

Question

私はイオン2を使用しています。私のアプリケーションでは、検証エラーがあった場合、情報アイコンが表示されます関連する入力フィールドの右側に表示されます。 HTMLは次のとおりです。

これは完全にうまくいきます。しかし、いつでも* ngIfをion-iconに追加すると、それはUIから消えます。ここでは、* ngIfをtrueに設定して動作するかどうかを確認するサンプルを示します。アイコンは表示されません。

<ion-list inset padding> 
     <ion-item> 
      <ion-input type="text" placeholder="Email"></ion-input> 
      <ion-icon name="ios-information-circle-outline" item-right *ngIf="true"></ion-icon> 
     </ion-item> 
    </ion-list> 

<ion-input>を<ion-icon>示すように、例えば上から除去されます。

これはIonic 2の制限事項ですか？ ion-inputを含むion-itemのアイコンを追加するにはどうすればよいですか？いくつかの問題は今のところ、イオン2であり、私は同じ問題に直面しています

Answer 1

<ion-item> 
     <ion-input type="text" placeholder="Email"></ion-input> 
     <ion-icon [ngClass]="{'hide': true }" name="ios-information-circle-outline" ></ion-icon> 
    </ion-item> 

    <style>.hide { display:none; } </style> 

Answer 2

この問題の回避策としてngClassを試してみてください私はこの

<ion-row> 
    <ion-col col-1> 
      <ion-icon name="phone-portrait"></ion-icon> 
    </ion-col> 
    <ion-col col-11> 
     <ion-item> 
      <ion-label floating>Phone number</ion-label> 
      <ion-input [(ngModel)]=" phoneNumber" name="phoneNumber" type="number"></ion-input> 
     </ion-item> 
    </ion-col> 
</ion-row> 

Answer 3

のようにそれをやった確認してくださいこの。これはionic2で私にとって完璧に働いています。

<ion-item class="from-group details"> 
<ion-label fixed>Details</ion-label> 
<ion-input type="file"></ion-input> 
    <ion-icon name="ios-camera-outline" item-right ></ion-icon> 
<ion-icon ios="ios-cloud-upload" md="md-cloud-upload" item-right ></ion-icon>