复选框中的trueValue和FalseValue不起作用 [英] trueValue anf falseValue not working in checkbox

问题描述

我正在开发角度应用程序，并使用Primeng的Treetable。我使用的是Primng v9。我的代码如下：

<p-carousel
  [value]="products"
  [numVisible]="3"
  [numScroll]="3"
  [circular]="false"
  [responsiveOptions]="responsiveOptions"
>
  <ng-template pTemplate="header">
    <h5>Basic</h5>
  </ng-template>
  <ng-template let-product let-i="index" pTemplate="item">
    <div class="product-item">
      <div class="product-item-content">
        <div class="p-mb-3"></div>
        <div>
          <p>{{ product.id }}</p>
          <h4 class="p-mb-1">{{ product.name }}</h4>
          <h6 class="p-mt-0 p-mb-3">${{ product.price }}</h6>
          <span
            [class]="
              'product-badge status-' + product.inventoryStatus.toLowerCase()
            "
            >{{ product.inventoryStatus }}</span
          >
          <div class="car-buttons p-mt-5">
            <p-button
              type="button"
              styleClass="p-button p-button-rounded p-mr-2"
              icon="pi pi-search"
            ></p-button>
            <p-button
              type="button"
              styleClass="p-button-success p-button-rounded p-mr-2"
              icon="pi pi-star"
            ></p-button>
            <p-button
              type="button"
              styleClass="p-button-help p-button-rounded"
              icon="pi pi-cog"
            ></p-button>
          </div>
        </div>
      </div>

      <div
        *ngFor="let cityData of myData; let i = index"
        style="position: relative;margin-top: 2rem;border-bottom: 1px solid #4E5668;"
      >
        <div style="display: flex; margin:1em; ">
          <span style="flex:1;">{{ cityData.name }}</span>
          <span style="flex:1;">
            <p-checkbox
              name="product"
              binary="true"
              [trueValue]="1"
              [falseValue]="0"
              [ngModel]="cityData.status[product.id]"
              (onChange)="toggleVisibility($event, cityData, product)"
              #checkbox
            ></p-checkbox>
          </span>
        </div>
      </div>
    </div>
  </ng-template>
</p-carousel>

Stackblitz： https://stackblitz.com/edit/primeng-carousel-demo-wwfs9w?file=src%2Fapp%2Fapp.component.html

我收到以下错误：

Can't bind to 'trueValue' since it isn't a known property of 'p-checkbox'.

对于FalseValue也是如此。我如何解决此问题？

推荐答案

Primeng v9没有trueValue和falseValue。

在v9中，您需要将布尔值绑定到p-checkbox，如下所示：

<p-checkbox
 name="product"
 binary="true"
 [ngModel]="cityData.status[product.id]===1"
 (onChange)="toggleVisibility($event, cityData, product)"
 #checkbox
 ></p-checkbox>

在这里，您将向p-复选框添加一个单向绑定。这将布尔值与复选框绑定：cityData.status[product.id]===<your-expected-value>

这篇关于复选框中的trueValue和FalseValue不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！