时间戳

首页 > 解决方案 > primeNg p-RadioButton 值不改变 html

html - primeNg p-RadioButton 值不改变 html

问题描述

我有以下单选按钮：

     <div class="nextgen-goal-overall-radiobuttons pull-left">
       <label class="nextgen-input-label">Overall Goal</label>
         <div class="radio-button-item pull-left" *ngFor="let goalType of goalTypesRadioButton">
          <p-radioButton  class="nextgen-radio-button" name="{{goalType.id}}" value="{{goalType.id}}" label="{{goalType.description}}" [(ngModel)]="selectedGoalTypeId"></p-radioButton>
         </div>
     </div>

当我单击任何单选按钮时，selectedGoalTypeId将使用相应的值进行更新。

我的问题是HTML我有以下条件divs：

  <div class="nextgen-input-container nextgen-goal-input pull-left">
          <span *ngIf="selectedGoalTypeId === 1" class="goals-currency-icon">{{currencyFormat}}</span>
        <label class="nextgen-input-label nextgen-target-group-label">{{selectedGoalTypeId}}</label>
        <input class="nextgen-input" [class.nextgen-input-budget] = "selectedGoalTypeId === 1" type="number" pInputText placeholder="">
      </div>
      <div *ngIf="selectedGoalTypeId === 3" class="nextgen-goal-frequency-dropdown pull-left">
        <label class="nextgen-input-label nextgen-target-group-label">Frequency</label>
        <p-dropdown [showTransitionOptions]="'0ms'" [hideTransitionOptions]="'0ms'" dropdownIcon="fa fa-angle-down" class= "nextgen-dropdown" [options]="FrequencyLookup" [(ngModel)]="selectedFrequency" value="selectedFrequency"></p-dropdown>
      </div>

询问selectedGoalTypeId是 1 还是 3，它是否显示一些 div。

这里的问题是selectedGoalTypeId正确更新。我在上面贴了一些标签HTML来检查。但是 div 不会根据条件而改变，尽管selectedGoalTypeId. 我在这里缺少什么？

标签： htmlangularradio-buttonprimeng

解决方案

在p-radioButton更改value="{{goalType.id}}"为[value]="goalType.id"

我想*ngIf="selectedGoalTypeId === 1"应该把它放在上面的 div 上而不是跨度上

在这里发布解决方案

PS：我猜goalType.id两者selectedGoalTypeId都是number

推荐阅读