Можно ли использовать атрибут id в компоненте html?

Question

Рассмотрим компонент c с html

<form id="someID"[formGroup]="codeEditorForm" novalidate>
</form>

с css

#SomeID{
color:grey;
}

Если C будет включен в родительский компонент P два раза тогда не будет дублироваться id, что не должно произойти в html

Вопрос 1 - не следует ли использовать id в Angular? Вопрос 2 - как мне тогда написать css правил без использования id?

Answer 1

Насколько я знаю, существуют различия между id и class.

Во-первых, id используется для одного указанного элемента c, тогда как class может предназначайтесь для нескольких элементов, это означает, что вы обычно используете селектор id, если вы уверены, что элемент не будет повторяться, что-то вроде navbar.

И второе, что селектор id более специфичен c чем class селектор, это означает, что если есть какие-либо конфликты стилей, правила, записанные в id правила переопределения селектора, написанные в class селектор

Обычно вы не будете использовать его для переопределения правил так как есть другой способ сделать это, чтобы решить, какой из них использовать, все, что вам нужно сделать, это подумать об этом >> действительно ли элемент, который вы даете идентификатору, будет уникальным?

Answer 2

Angular идентификатор поддержки на html. Но поскольку вы несколько раз загружаете компонент 'C' в свой компонент 'P', идентификатор будет дублирован. Так что лучше использовать класс вместо идентификатора на вашем html ..

<form class="yourClass"[formGroup]="codeEditorForm" novalidate>
</form>

На компонентах вашего * C 'css,

  .yourClass{
    color:grey;
    }

Answer 3

Вы can используете идентификаторы, но обычно вам это не нужно.

Angular определяет стили автоматически, поэтому класс, определенный в одном компоненте, не повлияет на класс с тем же именем в другом компоненте.

<form id="someID" class="my-form" [formGroup]="codeEditorForm" novalidate>
</form>

.my-form {
  color: green;
}

Также обратите внимание, что после определения свойства всегда следует указывать пробел. В опубликованном вами примере после someId" не было пробела. Возможно, в этом случае это не имеет значения, но я думаю, что лучше сразу же начать искать такие мелочи.