AngularJS - ng - если пустая строка строки проверки
это простой пример:
<a ng-if="item.photo == ''" href="#/details/{{item.id}}"><img src="/img.jpg" class="img-responsive"></a>
<a ng-if="item.photo != ''" href="#/details/{{item.id}}"><img ng-src="/{{item.photo}}" class="img-responsive"></a>
Я вижу, что он всегда генерирует условие item.photo != ''
, даже если значение пусто. Почему?
Ответы
Ответ 1
Вам не нужно явно использовать классификаторы, такие как item.photo == ''
или item.photo != ''
. Как и в JavaScript, пустая строка будет оценена как ложная.
Ваши взгляды будут намного чище и читабельнее.
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.min.js"></script>
<div ng-app init="item = {photo: ''}">
<div ng-if="item.photo"> show if photo is not empty</div>
<div ng-if="!item.photo"> show if photo is empty</div>
<input type=text ng-model="item.photo" placeholder="photo" />
</div
Ответ 2
Вероятно, ваш item.photo
равен undefined
, если у вас нет атрибута фотографии для элемента в первую очередь и, следовательно, undefined != ''
. Но если вы поместите код, чтобы показать, как вы предоставляете значения item
, это поможет.
PS: Извините, что опубликует это как ответ (я скорее считаю это скорее комментарием), но пока у меня недостаточно репутации.
Ответ 3
Если по "пустой" вы имеете в виду undefined
, это способ интерпретации ng-выражений. Затем вы можете использовать:
<a ng-if="!item.photo" href="#/details/{{item.id}}"><img src="/img.jpg" class="img-responsive"></a>
Ответ 4
Это то, что может происходить, если значение item.photo
не определено, тогда item.photo != ''
Всегда будет отображаться как true. И если вы думаете логически, это действительно имеет смысл, item.photo
не является пустой строкой (так что это условие выполняется), так как оно не undefined
.
Теперь для людей, которые пытаются проверить, является ли значение ввода пустым или нет в Angular 6, можно использовать этот подход.
Допустим, это поле ввода -
<input type="number" id="myTextBox" name="myTextBox"
[(ngModel)]="response.myTextBox"
#myTextBox="ngModel">