Question

请考虑以下代码：

<div ng-controller="SomeCtrl">
    <div ng-show="someVariable.someProperty">Value of someProperty is set</div>
</div>

现在，当我在我的SomeCtrl控制器中设置时：

$scope.someVariable.someProperty = 1;

它将按预期显示div。但是当我设置：

$scope.someVariable.someProperty = 0;

它没有，而我只是想隐藏它，以防$scope.someVariable.someProperty是undefined或null。当然，我可以编写一个简单的Javascript辅助函数来给我预期的结果，或写一些类似的东西：

<div ng-show="someVariable.someProperty || someVariable.someProperty == 0">Value of someProperty is set</div>

但是没有一种更优雅的方式在AngularJS中处理这个？

Answer 1

我只想隐藏它以防$ scope.someVariable.someProperty未定义或为空

在JavaScript中，undefined == null，但都不是== 0.不需要额外的函数或额外的条件 ng-show="someVariable.someProperty != null"

Answer 2

将你的逻辑更改为更像这样的东西：

ng-show="someVariable.someProperty !== null && someVariable.someProperty >= 0">

那样null或undefined将是假的。

我几乎忘记了null >= 0 === true（愚蠢的Javascript：）

Answer 3

将一个函数放在控制器中，如下所示：

$scope.shouldShow = function() {
   if($scope.someVariable.someProperty === null || 
      $scope.someVariable.someProperty === "undefined") {
      return false;
   }
   return true;

}

并在html中：

<div ng-show="shouldShow()">Value of someProperty is set</div>

Answer 4

如@tymeJV所述，“0”在JS中被评估为false，因此ng-show =“0”将评估隐藏div。

在SomeCtrl中，您可以编写一个函数来封装逻辑，以确定someProperty是null还是undefined，并根据该评估返回true或false。

angular.module("app")
.controller("SomeCtrl", function($scope) {
    $scope.someVariable = {};
    $scope.someVariable.someProperty = null;
    $scope.isNullorUndefined = function(value) {
        return value === null || angular.isUndefined(value);         
    };
});

<div ng-show="!isNullOrUndefined(someVariable.someProperty)">Value of someProperty is set</div>

AngularJS未定义，null和0

4 个答案: