离子2 - 内卡离子电池输入丢失勾勒

我的HTML看起来像下面离子2 - 内卡离子电池输入丢失勾勒

<ion-content padding> 
    <ion-card> 
    <ion-card-header> 
     Header 
    </ion-card-header> 

    <ion-card-content> 
     <form (ngSubmit)='someAction()'> 

     <ion-item> 
      <ion-label stacked>Some Label</ion-label> 
      <ion-input name="some-input" type="text" value="some-value"></ion-input> 
     </ion-item> 

     </form> 
    </ion-card-content> 
    </ion-card> 
</ion-content>

输入通常将有一个蓝色的底部外形，填充时则变成绿色

然而，当。在卡内使用时，仅当输入被点击并输入值时才会显示轮廓。

即使将其放置在卡内，是否仍然可以显示轮廓？

来源

2017-02-15 user2085143

如果您在外面制作该表单，卡内的输入就像那样工作。卡会像你期望的那样工作。所以，也许改变你正在尝试：D –

你有没有找到任何解决方案，它似乎不工作在ios –

这只是Ionic工作的方式。如果您需要在卡片中设置轮廓，您需要在CSS中手动执行 – user2085143

我这样做，

ion-input { 
    border-bottom: 0.5px solid map-get($colors, primary); 
}

这很简单，并显示与底线所有输入就像是重点。这不是我想要的结果，但它比显示空白输入要好。

来源

2017-08-07 19:26:20

这是离子 https://github.com/ionic-team/ionic/issues/11640

一个已知的问题。然而，您可以通过，直到这个问题是由团队固定将此代码添加到您的app.scss修复它。

.card-md .item-md.item-block:not(:last-child) .item-inner { 
    border-bottom: 1px solid #dedede; 
} 

.card-md .item-md.item-block:not(.item-input):not(.item-select):not(.item-radio):not(.item-checkbox) .item-inner { 
    border: 0; 
}

来源

2017-08-30 03:29:01

离子2 - 内卡离子电池输入丢失勾勒

回答

相关问题