Угловые директивы — Запуск @Input setter с «null» против «»» (пустой строки)

#angular #input

#угловые #ввод

Вопрос:

Я заметил, что параметр @Input в директиве изначально не вызывается, когда в шаблоне указано значение пустой строки («»). Но когда указано значение «null» или «false», вызывается метод setter.

Почему это?

Насколько я читал, пустая строка является ложным значением в JS, так почему передача пустой строки не работает как «null» или «false»? Это функция?

ДИРЕКТИВА:

 @Directive({
  selector: '[myInputDir]'
})

export class ExampleDirectiveClass {
  @Input('myInputDir') public set valFromMyInput(value: string) {
    if (value) {
      this._inputVal = value;
    } else {
      this._inputVal = 'setUpVal';
    }
  }
(... rest of the class)
}
  

HTML

 (...)
<input
  [myInputDir]="">
</input>
(...)
  

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

1. Я подозреваю, что это потому, что пустая строка («») принимает ее как значение по умолчанию string

2. Ответы, данные Mat-Dob-Dev и пользователем 3548205, действительны. В принципе, когда ничего не предоставляется, undefined «предоставляется». И кажется, что undefined, даже если это ложное значение, не запускает установщик.

Ответ №1:

В данном примере вы не предоставляете пустую строку. Вы вообще не предоставляете никакого значения (таким образом, установщик не был вызван).

Недопустимый пример (вообще нет значения):

 <input
  [myInputDir]="">
</input>
  

Допустимый пример предоставления пустой строки в качестве входного значения:

 <input
  [myInputDir]="''">
</input>
  

Квадратные скобки вокруг имени ввода указывают Angular, что выражение шаблона должно быть заключено в кавычки.

Ответ №2:

Переменная, которую вы хотите передать атрибуту, отсутствует. Вы ничего не жертвуете, что не определено.

 <input
  [myInputDir]="putAnyVariableHere">
</input>
  

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

1. Да, это имеет смысл. Это так просто.. Я думаю, при написании этого вопроса я «забыл», что это HTML, а пустые кавычки сами по себе не имеют никакого значения.