PrimeNg p-RadioButton значение не меняется HTML - PullRequest
0 голосов
/ 18 октября 2019

У меня есть следующие радиокнопки:

     <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. Что мне здесь не хватает?

1 Ответ

1 голос
/ 18 октября 2019

In p-radioButton изменить value="{{goalType.id}}" на [value]="goalType.id"

И я полагаю, что *ngIf="selectedGoalTypeId === 1" должен быть размещен на верхнем div, чем на промежутке

Отправлено решение Здесь

PS: я думаю goalType.id и selectedGoalTypeId оба number

...