Does angular.equals() work as an angular expressions?

Question

I'm trying to display a div if an object is non-empty. Using this answer, Im trying to use angular.equals to check emptyness, but its not behaving as expected

var test = angular.module('test',[]);

test.controller('testCtrl', ['$scope', function($scope){
  $scope.foo={};
  $scope.bar="bam"
}]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="test">
  <div ng-controller="testCtrl">
    <div ng-show="!angular.equals(foo,{})">{{bar}}</div>
  </div>
</div>

The expectation here is that the value of bar will only show if foo is not equal to an empty object. However, foo is clearly set to {} and yet bar still shows.

Answer 1

If you want to access the angular object from templates or expressions, you have to make it available on the scope of where you want to use it. In this case you can put it on the testCtrl's scope.

var test = angular.module('test',[]);

test.controller('testCtrl', ['$scope', function($scope){
  $scope.angular = angular;
  $scope.foo={};
  $scope.bar="bam"
}]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="test">
  <div ng-controller="testCtrl">
    <div ng-show="!angular.equals(foo,{})">{{bar}}</div>
  </div>
</div>

I generally put utility objects on $rootScope, so they're available from everywhere.