All geek questions in one place

How to remove a selection indicator (dot) in ng-bootstrap switches

Here is an example provided by ng bootstrap. demo

I copy the same code with only labels and values ​​replaced in my angular project and get the following result. my result

The HTML provided here

<div _ngcontent-c1="" class="btn-group btn-group-toggle special ng-valid ng-dirty ng-touched" name="radioBasic" ngbradiogroup="" role="group" ng-reflect-name="radioBasic" ng-reflect-model="user1"> <label _ngcontent-c1="" class="btn-primary btn active" ngbbuttonlabel=""> <input _ngcontent-c1="" ngbbutton="" type="radio" value="user1" ng-reflect-value="user1" name="radioBasic">User1 </label> <label _ngcontent-c1="" class="btn-primary btn" ngbbuttonlabel=""> <input _ngcontent-c1="" ngbbutton="" type="radio" value="user2" ng-reflect-value="user2" name="radioBasic">User2 </label> </div>

Why is my result different from the example? How to remove selection points?

Any correction or pointer to documents will be highly appreciated!

EDIT:

Versions here

Angular CLI: 1.6.1

Angular: 5.1.3

bootstrap@4.0.0-alpha.6

@ ng bootstrap / ng bootstrap @ 1.0.0-beta.9

+5
source share
2 answers

ng-bootstrap@1.0.0-beta.9 not fully compatible with bootstrap@4.0.0-alpha.6 .

As bootstrap 4 beta 3 evolves and changes the radio and checkbox, ng-bootstrap no longer works with the previous version.

The best solution is to switch to bootstrap@4.0.0-beta.3 .

If you cannot, you must save ng-bootstrap@1.0.0-beta.8 .

+1
source

Go to bootstrap@4.0.0-beta.3 to use @ng-bootstrap/ ng-bootstrap@1.0.0-beta.9 .

If you are blocked on bootstrap@4.0.0-beta.2 (angular-cli issue ), you can go to @ng-bootstrap/ ng-bootstrap@1.0.0-beta.8 . But note that live ng-bootstrap docs shows the latest version, and the btn-group-toggle class did not previously need 1.0.0-beta.8 .

Job demonstration

0
source

Source: https://habr.com/ru/post/1274548/

More articles:


All Articles