В чем разница между [attr.name] и [name]

Question

У меня вопрос о [attr.name] и [name], я использую querySelectorAll в своих ts в следующей форме =>

this._document.querySelectorAll("input[name="+'checkModel-'"]")

и если я определю в html вот так ->

<input [name]="checkModel-" type="checkbox">

Я получаю список узлов пустым, а я делаю

<input [attr.name]="checkModel-" type="checkbox">

Список узлов возвращает ожидаемое значение / значения, есть ли разница между ними?

Answer 1

Элемент input HTML имеет атрибут с именем «name». Он используется для установки имени данного элемента управления. По какой-то причине привязка вашего свойства может не работать из-за незакрытого тега или ошибки в синтаксисе HTML.

Привязка свойств

<input [value]="yourVariableName" />

Привязка значения свойств в любом заданном элементе управления или HTML для переменной или метода. Чтобы это работало правильно, вы должны использовать существующий атрибут HTML, например «name», «max», «min», «type». Если вы этого не сделаете, произойдет следующая ошибка:

Template parse errors: Can't bind to 'data-username' since it isn't a known native property

Attribute Binding

<input [attr.name]="yourVariableName" />

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