개체가 비어 있는지 확인하고 ng-show에서는 작동하지만 컨트롤러에서는 작동하지 않습니까?

이렇게 선언 된 JS 개체가 있습니다.

$scope.items = {};

이 개체를 항목으로 채우는 $ http 요청도 있습니다. 이 항목이 비어 있는지 감지하고 싶습니다. ng-show가이를 지원하는 것 같습니다 ... 입력

ng-show="items"

그리고 마술처럼 작동합니다. 컨트롤러에서도 똑같이하고 싶지만 작동하지 않는 것 같습니다. 속성이 있는지 확인하기 위해 객체를 반복해야하거나 lodash 또는 밑줄을 사용해야 할 수 있습니다. .

대안이 있습니까?

나는 시도했다

alert($scope.items == true);

그러나 객체가 생성되고로 채워질 때 항상 false를 반환 $http하므로 그렇게 작동하지 않습니다.

여기서는 빈 개체 리터럴을 사용할 필요가 없습니다. null 또는 undefined를 사용할 수 있습니다.

$scope.items = null;

이런 식으로 ng-show계속 작동해야하며 컨트롤러에서 다음을 수행 할 수 있습니다.

if ($scope.items) {
    // items have value
} else {
    // items is still null
}

그리고 $http콜백에서 다음을 수행합니다.

$http.get(..., function(data) {
    $scope.items = {
        data: data,
        // other stuff
    };
});

또는 다음과 같이 간단하게 유지할 수 있습니다.

alert(angular.equals({}, $scope.items));

개인 프로젝트에서이 필터를 작성했습니다.

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>

테스트 :

describe('Filter: isEmpty', function () {

    // load the filter's module
    beforeEach(module('myApp'));

    // initialize a new instance of the filter before each test
    var isEmpty;
    beforeEach(inject(function ($filter) {
        isEmpty = $filter('isEmpty');
    }));

    it('should return the input prefixed with "isEmpty filter:"', function () {
          expect(isEmpty({})).toBe(true);
          expect(isEmpty({foo: "bar"})).toBe(false);
    });

});

문안 인사.

또 다른 간단한 한 줄 :

var ob = {};
Object.keys(ob).length // 0

항목 OBJ가 null과 같지 않은 경우 다음을 수행 할 수 있습니다.

$scope.isEmpty = function (obj) {
    for (var i in obj) if (obj.hasOwnProperty(i)) return false;
    return true;
};

보기에서 다음을 수행 할 수 있습니다.

<div ng-show="isEmpty(items)"></div>

넌 할 수있어

var ob = {};
Object.keys(ob).length

브라우저가 ECMAScript 5를 지원하는 경우에만 해당됩니다. 예를 들어 IE 8은이 기능을 지원하지 않습니다.

자세한 정보는 http://kangax.github.io/compat-table/es5/ 참조

if( obj[0] )

이것의 더 깨끗한 버전은 다음과 같습니다.

if( typeof Object.keys(obj)[0] === 'undefined' )

개체 속성이 설정되지 않은 경우 결과가 정의되지 않습니다.

또는 lo-dash를 사용하는 경우 : _.empty (value).

"값이 비어 있는지 확인합니다. 길이가 0 인 배열, 문자열 또는 인수 개체와 고유 한 열거 가능한 속성이없는 개체는"빈 "것으로 간주됩니다."

빈 개체 확인

$scope.isValid = function(value) {
    return !value
}

항목의 길이를 확인할 수 있습니다

ng-show="items.length"