Question

我是Angular的新手，我想在Object为空的情况下隐藏一些特定的HTMl，但我怎样才能实现呢？

到目前为止，我有：

$scope.links = data.links;

然后：

<div ng-if="links">
    /// some more html
</div>

但这不起作用。任何帮助表示赞赏...

Answer 1

在这种情况下，我会编写一个简单的函数来使用：

$scope.showLinks = function () {

  return $scope.links !== undefined && $scope.links !== null && $scope.links.length > 0;
}

然后

<div ng-if="showLinks()">
    /// some more html
</div>

Answer 2

控制器：

$scope.linksLength = Object.keys(data.links).length > 0;

HTML：

<div ng-show="linksLength">
    /// some more html
</div>

Answer 3

只需将.length添加到ng-if="links"，然后将ng-if更改为ng-show。

<强> E.g。

<div ng-show="links.length">
    /// some more html
</div>

如果ng-show检测到links.length的值为0，则false如果不等于0则为true。

0 = false

> 0 = true

希望它有所帮助。

Answer 4

使用ngHide或ngShow。

<div ng-show="links.length">

https://docs.angularjs.org/api/ng/directive/ngHide

Answer 5

<body>
<div ng-app="myApp" ng-controller="myCtrl" >
<p ng-hide="isempty(products)">element</p>
</div>

<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {

$scope.products=[];

$scope.isempty=function(obj)
{
return (angular.equals([], obj));
}
});
</script>
</body>

如何在对象为空时隐藏Angular中的html

5 个答案: