Блог

Главная - Вопросы по программированию - Флажок Угловой

Флажок Угловой

#javascript #angular #checkbox

Вопрос:

Я использую angular, и я не уверен, что проблема в этом. Поэтому у меня есть флажок, и когда я нажимаю на него, он работает, но когда мне нужно выбрать другой объект, и мне нужно нажать на него. Похоже, что он (флажок) имеет предыдущее состояние. Мне это нужно, если я выберу другой элемент для нажатия. Он имеет состояние по умолчанию (которое отключено (ложь)).

.ts

 show = false

toggleContract() {
   this.show = !this.show
}

.html

 <p-checkbox  (click)='toggleContract()' [ngModel]="show"></p-checkbox>
<ng-container *ngIf="show"><ng-container />

Комментарии:

1. Вы можете использовать [(ngModel)] для двусторонней привязки. На самом деле вам не нужна функция, так как вы привязали show переменную к своему флажку

2. Если я использую двустороннюю привязку, это просто невозможно проверить

3. Просто снимите функцию и (click) обработчик событий с вашего флажка

4. Извините, я прочитал это до того, как оно было изменено. Что ж, я пытался. Я также должен сказать, что этот флажок влияет на то, отображается ли один div или нет, если я делаю так, как вы сказали. Поведение остается прежним/, и div появляется один раз и остается показанным независимо от того, сколько раз я нажал

Ответ №1:

Вы пытались добавить ngModelOptions="{standalone: true}" в свой флажок?

Комментарии:

1. Попробовал тот же результат, он должен выглядеть так ? <p-флажок (щелчок)=’toggleContract()'[ngModel]=»показать» ngModelOptions=»{автономно: верно}»><p-флажок (щелчок)=’toggleContract()'[ngModel]=»показать» ngModelOptions=»{автономно: верно}»></p-флажок>

2. да, но вам нужно использовать двустороннюю привязку, как это [(ngModel)] .

3. Показать полный код, связанный с проблемой, на stackblitz, например

Ответ №2:

Вы можете использовать двустороннюю привязку [(ngModel)] , тогда вам не нужно обрабатывать событие. Угловой делает это сам.

HTML:

 <p-checkbox  [(ngModel)]="show"></p-checkbox>
<ng-container *ngIf="show"><ng-container />

Машинописный текст:

 show = false

Ответ №3:

Предполагая, что вы используете PrimeNG — предположение, сделанное из p-флажка

По какой-то причине похоже, что PrimeNG имеет несколько значений, установленных по умолчанию, и поэтому ожидает массив. По-видимому, вы можете перейти [binary]="true" к переопределению этой функции и напрямую привязаться к одному логическому значению.

 <p-checkbox [(ngModel)]="show" [binary]="true"></p-checkbox>
Метки: