Должен ли я префикс имени атрибутов в угловых компонентах?

Question

У меня есть переключатели в пользовательском угловом компоненте, как показано ниже. Я использую этот пользовательский компонент в моем основном компоненте. И в моем основном компоненте я использую точно такие же кнопки. Проблема в том, что они не работают должным образом, если я не изменяю атрибуты имени.

Код пользовательского компонента указан ниже.

<div class="form-group row">
                        <label class="col-md-3 form-control-label">{{'dvTrackVehicleNumber.showSettings'|translate}}</label>
                        <div class="col-md-9">
                            <div class="btn-group" data-toggle="buttons">
                                <label  style="cursor: pointer;" class="btn btn-primary" [ngClass]="{'active':showSettings=='NONE'}">
                                    <input [(ngModel)]="showSettings" type="radio" value="NONE" name="showSettings" > {{'dvTrackVehicleNumber.showNoSettings'|translate}}
                                </label>
                                <label  style="cursor: pointer;" class="btn btn-primary" [ngClass]="{'active':showSettings=='CONFIGMAIN'}">
                                     <input  [(ngModel)]="showSettings" type="radio" value="CONFIGMAIN" name="showSettings" > {{'dvTrackVehicleNumber.configMain'|translate}}
                                </label>
                                <label  style="cursor: pointer;" class="btn btn-primary" [ngClass]="{'active':showSettings=='CONFIGSETTINGS'}">
                                     <input  [(ngModel)]="showSettings" type="radio" value="CONFIGSETTINGS" name="showSettings" > {{'dvTrackVehicleNumber.configSettings'|translate}}
                                </label>
                            </div>      
                        </div>
                    </div> 

Если я изменил name = "showSettings" на name = "showSettingsModal" во всех переключателях внутри моего пользовательского компонента и оставил его как name = "showSettings" в основной системе компонентов, то он работает нормально. Очевидно, это вызывает конфликт. Но мне любопытно, что в Интернете есть много пользовательских компонентов, которые вы можете использовать, и они не вызывают никаких проблем. Должен ли я префикс всех моих атрибутов имени или есть лучший способ? или может я что-то не так делаю?

Спасибо

Answer 1

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

Лучше использовать другое имя группы, как вы уже сделали.