web-dev-qa-db-fra.com

Comment vérifier si une variable de portée est indéfinie dans le modèle AngularJS?

Comment vérifier si une variable de portée est ndefined?

Cela ne fonctionne pas:

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

Voici le moyen le plus propre de le faire:

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

Pas besoin de créer une fonction d'assistance dans le contrôleur!

65
JLewkovich

Utiliser undefined pour prendre une décision est généralement un signe de mauvaise conception en Javascript. Vous pourriez envisager de faire autre chose.

Cependant, pour répondre à votre question: je pense que la meilleure façon de le faire serait d’ajouter une fonction d’aide.

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

et dans le modèle

<div ng-show="isUndefined(foo)"></div>
26
Umur Kontacı

Corrigée:

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' );
}

Violon: http://jsfiddle.net/oakley349/vtcff0w5/1/

9
Oakley

Si foo est pas une variable booléenne alors cela fonctionnera (c'est-à-dire que vous voulez montrer ceci quand cette variable a des données):

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

Et inversement:

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

3
Naguib Ihab

Publier une nouvelle réponse depuis le Angular comportement a changé. La vérification de l’égalité avec undefined fonctionne maintenant dans les expressions angular, au moins à partir de 1.5, de la même manière que le code suivant:

ng-if="foo !== undefined"

Lorsque la valeur ng-if est évaluée à true, la suppression de la propriété percentages de l'étendue appropriée et l'appel de $ digest suppriment l'élément du document, comme vous le souhaitiez.

3
Tahsis Claus

Vous pouvez utiliser l'opération à double canal pour vérifier si la valeur n'est pas définie, l'instruction 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>

Vérifiez la démo de JSFiddle

Pour des explications techniques sur le double tuyau, je préfère consulter ce lien: https://stackoverflow.com/a/34707750/6225126

1
Mahdi Fathalla

Comme @impulsgraw l'a écrit. Vous devez rechercher les indéfinis après les tuyaux:

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

https://jsfiddle.net/mjfz2q9h/11/

1
D-Unit

Si vous utilisez Angular 1, je vous recommanderais d'utiliser la méthode intégrée d'Angular:

angular.isDefined (valeur);

référence: https://docs.angularjs.org/api/ng/function/angular.isDefined

1
Syed Usman