控制器中有一个简单的对象,有时候可以是空({})。
app.controller('TestController',function() { var vm = this; vm.testObject = {}; });
当对象为空时,我想隐藏或显示相应模板中的某些DOM元素。
我试图用简单的< divng-if =“vm.testObject”>但是当vm.testObject === {}在ng-if中被认为是真的。
<div ng-controller="TestController as vm"> <div ng-if="vm.testObject"> Test Object is not empty </div> <div ng-if="!vm.testObject"> Test Object is empty </div> </div>
有没有一种简单的方式来检查模板中的空白对象?优选地,不向该范围添加新变量。
这是一个工作的Plunker:
http://plnkr.co/edit/Qed2MKmuedcktGGqUNi0?p=preview
你可以移动平等检查到ng-if吗?
<div ng-controller="TestController as vm"> <div ng-if="!equals({},vm.testObject)"> Test Object is not empty </div> <div ng-if="equals({},vm.testObject)"> Test Object is empty </div> </div>
否则,在范围上提供一个帮助器
app.controller('TestController',function() { var vm = this; vm.testObject = {}; vm.empty = function() { return vm.testObject === {}; }; });
然后
<div ng-controller="TestController as vm"> <div ng-if="!vm.empty()"> Test Object is not empty </div> <div ng-if="vm.empty()"> Test Object is empty </div> </div>