오브젝트가 비어 있는지 확인하고 컨트롤러에서 ng-show로 동작하지 않는지 확인합니다.

오브젝트가 비어 있는지 확인하고 컨트롤러에서 ng-show로 동작하지 않는지 확인합니다.

다음과 같이 선언된 JS 개체가 있습니다.

$scope.items = {};

이 오브젝트에 아이템을 채우는 $http 요청도 있습니다.이 아이템이 비어있는지 검출하고 싶은데, ng-show가 이것을 지원하는 것 같습니다.나는 들어간다

ng-show="items"

마법처럼 동작합니다.컨트롤러에서도 같은 동작을 하고 싶은데 동작시킬 수 없습니다.속성이 있는지 확인하기 위해 오브젝트를 반복하거나 로더시 또는 언더스코어를 사용해야 할 것 같습니다.

다른 대안이 있나요?

노력했어

alert($scope.items == true);

그러나 오브젝트가 생성되고 이 오브젝트가 로 채워지면 항상 false가 반환됩니다.$http그래서 그런 식으로 작동하지 않습니다.

또는 다음과 같은 방법으로 단순성을 유지할 수 있습니다.

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);
    });

});

안부 전해요.

여기서는 빈 개체 리터럴을 사용할 필요가 없습니다. null 또는 정의되지 않은 것을 사용할 수 있습니다.

$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
    };
});

또 다른 간단한 원라이너:

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인 배열, 문자열 또는 인수 개체와 자체 열거 가능한 속성이 없는 개체는 "빈"으로 간주됩니다.

[ Empty object ]체크박스를 켜겠습니다

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

아이템의 길이를 확인할 수 있습니다.

ng-show="items.length"

언급URL : https://stackoverflow.com/questions/17839141/checking-if-object-is-empty-works-with-ng-show-but-not-from-controller