Как проверить, не определена ли переменная области в шаблоне AngularJS?

Как проверить, является ли переменная области undefined?

Это не работает:

<p ng-show="foo == undefined">Show this if $scope.foo == undefined</p>

8 ответов


здесь самый чистый способ сделать это:

<p ng-show="{{foo === undefined}}">Show this if $scope.foo === undefined</p>

нет необходимости создавать вспомогательную функцию в контроллере!


используя undefined принятие решения обычно является признаком плохого дизайна в Javascript. Вы могли бы заняться чем-нибудь другим.

однако, чтобы ответить на ваш вопрос: я думаю, что лучший способ сделать это-добавить вспомогательную функцию.

$scope.isUndefined = function (thing) {
    return (typeof thing === "undefined");
}

и в шаблоне

<div ng-show="isUndefined(foo)"></div>

исправлено:

HTML-код

  <p ng-show="getFooUndef(foo)">Show this if $scope.foo === undefined</p>

JS

$scope.foo = undefined;

$scope.getFooUndef = function(foo){
    return ( typeof foo === 'undefined' );
}

Скрипка:http://jsfiddle.net/oakley349/vtcff0w5/1/


Если foo is не булева переменная тогда это будет работать (т. е. вы хотите показать это, когда эта переменная имеет некоторые данные):

<p ng-show="!foo">Show this if $scope.foo is undefined</p>

и наоборот:

<p ng-show="foo">Show this if $scope.foo is defined</p>


публикация нового ответа, так как угловое поведение изменилось. Проверка равенства с undefined теперь работает в угловых выражениях, по крайней мере, с 1.5, так как работает следующий код:

ng-if="foo !== undefined"

когда это значение ng-if равно true, удаление свойства percentages из соответствующей области и вызов $digest удаляет элемент из документа, как и следовало ожидать.


Если вы используете Angular 1, я бы рекомендовал использовать встроенный метод Angular:

угловое.isDefined (value);

ссылка:https://docs.angularjs.org/api/ng/function/angular.isDefined


вы можете использовать операцию двойной трубы, чтобы проверить, не определено ли значение оператора after:

<div ng-show="foo || false">
    Show this if foo is defined!
</div>
<div ng-show="boo || true">
    Show this if boo is undefined!
</div>

проверить JSFiddle для демонстрации

для технического объяснения двойной трубы я предпочитаю взглянуть на эту ссылку: https://stackoverflow.com/a/34707750/6225126


<p ng-show="angular.isUndefined(foo)">Show this if $scope.foo === undefined</p>