離子條件線變化

Question

如何在Ionic中動態更改no-lines屬性的值？

我努力了：

<ion-item [no-lines]='condition'> test </ion-item>

這給我一個錯誤：

錯誤：模板解析錯誤：無法綁定到“無行”，因為它不是“ ion-item”的已知屬性。 1.如果“ ion-item”是Angular組件，並且具有“ no-line”輸入，則請驗證它是否是此模塊的一部分。 2.如果“ ion-item”是Web組件，則將“ CUSTOM_ELEMENTS_SCHEMA”添加到該組件的“ @ NgModule.schemas”以禁止顯示此消息。 3.要允許任何屬性，請在此組件的“ @ NgModule.schemas”中添加“ NO_ERRORS_SCHEMA”。 （“/ DIV>

Answer 1

<ion-item [attr.no-lines]='condition'> test </ion-item>

您需要[attr.no-lines]而不是no-lines 。 另外，值得注意的是，如果您希望顯示行，則需要將表達式評估為null而不是false 。

<ion-header>
  <ion-navbar>
    <ion-title>{{ appName }} 3.4.0</ion-title>
  </ion-navbar>
</ion-header>

<ion-content>
  <ion-item>
    Item 1
  </ion-item>
  <ion-item no-lines>
    Item 2
  </ion-item>
  <ion-item [attr.no-lines]="null">
    Item 3
  </ion-item>
  <ion-item [attr.no-lines]="true">
    Item 4
  </ion-item>
  <ion-item [attr.no-lines]="false">
    Item 5
  </ion-item>
</ion-content>

上面的項目1和3有行，而項目2、4和5沒有。

Answer 2

您可以使用以下方法向元素添加其他屬性：

<div [attr.no-lines]='yourExpression'></div>