В области контроллера у меня есть что-то вроде:
$scope.card = {};
В представлении я должен проверить, остается ли мой объект пустой литерал, {} или если он содержит некоторые данные в некоторых полях.
Я пробовал это:
ng-show="angular.equals({}, card)"
и
ng-show="!angular.equals({}, card)"
но это не сработало.
Есть ли лучшие способы? Как вы проверяете, является ли объект пустым или содержит некоторые поля?
Вы можете использовать: Object.keys(card).length === 0
Но убедитесь, что вы используете его из метода контроллера, поскольку Object недоступен в представлении, например:
$scope.isObjectEmpty = function(card){
return Object.keys(card).length === 0;
}
Затем вы можете вызвать функцию из представления:
ng-show="!isObjectEmpty(card)"
Используйте фильтр json и сравните с строкой '{}'.
<div>
My object is {{ (myObject | json) == '{}' ? 'Empty' : 'Not Empty' }}
</div>
ng-show пример:
<div ng-show="(myObject | json) != '{}'"></div>
Создайте функцию, которая проверяет, пустой ли объект:
$scope.isEmpty = function(obj) {
for(var prop in obj) {
if(obj.hasOwnProperty(prop))
return false;
}
return true;
};
Затем вы можете проверить это в своем html:
ng-show="!isEmpty(card)"
попробуйте этот способ с фильтром
angular.module('myApp')
.filter('isEmpty', function () {
var bar;
return function (obj) {
for (bar in obj) {
if (obj.hasOwnProperty(bar)) {
return false;
}
}
return true;
};
});
использование:
<p ng-hide="items | isEmpty">Some Content</p>
Через from: Проверка наличия пустого объекта, работает с ng-show, но не с контроллера?
Попробуйте следующее:
angular.equals({}, $scope.card)
http://plnkr.co/edit/u3xZFRKYCUh4D6hGzERw?p=preview
Поскольку angular недоступен из области действия, вы можете передать его в область вашего контроллера.
$scope.angular = angular;
Это сделает проверку пустого объекта:
<div ng-if="isEmpty(card)">Object Empty!</div>
$scope.isEmpty = function(obj){
return Object.keys(obj).length == 0;
}
Нельзя инициализировать вашу переменную пустым объектом, но пусть это будет undefined или null до тех пор, пока не будут существовать условия, где должно быть значение null/undefined:
$scope.card;
if (someCondition = true) {
$scope.card = {};
}
Затем ваш шаблон:
ng-show="card"
попробуй это
if(object.key==undefined){
// object empty
}else{
// object exist
}
в HTML
*ngIf="object.key==undefined"
Создайте функцию $scope, которая проверяет ее и возвращает true или false, например функцию isEmpty, и используйте в вашем представлении выражение ng-if, например
ng-if="isEmpty(object)"
Я столкнулся с аналогичной проблемой при проверке пустоты в component. В этом случае контроллер должен определить метод, который фактически выполняет тест, и представление использует его:
function FormNumericFieldController(/*$scope, $element, $attrs*/ ) {
var ctrl = this;
ctrl.isEmptyObject = function(object) {
return angular.equals(object, {});
}
}
<!-- any validation error will trigger an error highlight -->
<span ng-class="{'has-error': !$ctrl.isEmptyObject($ctrl.formFieldErrorRef) }">
<!-- validated control here -->
</span>
Вы можете использовать свойство length, чтобы проверить, пуст ли объект или нет.
<div ng-show="card.length > 0" >
</div>
Я должен был проверить пустую проверку объекта, как показано ниже
например:
<div data-ng-include="'/xx/xx/xx/regtabs.html'" data-ng-if =
"$parent.$eval((errors | json) != '{}')" >
</div>
Ошибка - мой объект области видимости, он определяется в моем контроллере как $scope.error = {};
Вы можете использовать простой класс Object класса javascript для достижения этого, в классе Object есть функция keys, которая принимает 1 аргумент в качестве входных данных следующим образом:
Object.keys(obj).length === 0
Вы можете достичь этого тремя способами, 1) Область действия текущего контроллера 2) Фильтр 3) $ rootScope
1) Первый способ - это область действия текущего контроллера,
$ scope.isObjEmpty = function (obj) {return Object.keys(obj).length === 0; } }
Затем вы можете вызвать функцию из представления:
ng-show = "! isObjEmpty (obj)", если вы хотите динамически отображать и скрывать dom & ng-if = "! isObjEmpty (obj)", если вы хотите динамически удалять или добавлять dom.
2) Второй способ - это пользовательский фильтр. Следующий код должен работать для объекта и массива,
angular.module('angularApp')
.filter('isEmpty', [function () {
return function (obj) {
if (obj == undefined || obj == null || obj == '')
return true;
if (angular.isObject(obj))
return Object.keys(obj).length != 0;
for (var key in obj) {
if (obj.hasOwnProperty(key)) {
return false;
}
}
return true;
};
}]);
<div ng-hide="items | isEmpty"> Your content goes here </div>
3) Третий способ - это $ rootScope, создайте простую функцию javascript и добавьте ее на сервер $ rootScope, он будет доступен по умолчанию во всех областях и в пользовательском интерфейсе.
function isObjEmpty (obj) {return Object.keys(obj).length === 0; } }
$ rootScope.isObjEmpty = isObjEmpty;
Хороший и эффективный способ - использовать в вашем HTML файле "трубу json", как показано ниже:
<pre>{{ yourObject | json }}</pre>
что позволяет вам ясно видеть, пуст объект или нет.
Я попробовал довольно много способов, которые показаны здесь, но ни один из них не сработал.
Вам нужно просто проверить, что объект имеет значение null или нет. AngularJs предоставляет встроенную директиву ng-if. Пример приведен ниже.
<tr ng-repeat="key in object" ng-if="object != 'null'" >
<td>{{object.key}}</td>
<td>{{object.key}}</td>
</tr>