Kiểm tra xem đối tượng có trống không, hoạt động với ng-show nhưng không hoạt động với bộ điều khiển?

Tôi có một đối tượng JS được khai báo như vậy

$scope.items = {};

Tôi cũng có một yêu cầu $ http điền vào đối tượng này với các mục. Tôi muốn phát hiện xem mục này có trống không, có vẻ như ng-show hỗ trợ điều này ... Tôi nhập

ng-show="items"

và điều kỳ diệu là nó hoạt động, tôi cũng muốn làm điều tương tự từ một bộ điều khiển nhưng dường như tôi không thể làm cho nó hoạt động, có vẻ như tôi có thể phải lặp lại đối tượng để xem nó có bất kỳ thuộc tính nào không hoặc sử dụng dấu gạch ngang hoặc dấu gạch dưới .

Có giải pháp thay thế không?

Tôi đã thử

alert($scope.items == true);

nhưng nó luôn trả về false, khi đối tượng được tạo và khi được điền với $http, vì vậy nó không hoạt động theo cách đó.

Sử dụng một đối tượng rỗng theo nghĩa đen là không cần thiết ở đây, bạn có thể sử dụng null hoặc undefined:

$scope.items = null;

Bằng cách này, ng-showsẽ tiếp tục hoạt động và trong bộ điều khiển của bạn, bạn chỉ có thể làm:

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

Và trong các lệnh $httpgọi lại của mình , bạn thực hiện như sau:

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

Hoặc bạn có thể làm cho nó đơn giản bằng cách làm như sau:

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

Trong một dự án riêng tư, một người đã viết bộ lọc này

angular.module('myApp')
    .filter('isEmpty', function () {
        var bar;
        return function (obj) {
            for (bar in obj) {
                if (obj.hasOwnProperty(bar)) {
                    return false;
                }
            }
            return true;
        };
    });

sử dụng:

<p ng-hide="items | isEmpty">Some Content</p>

thử nghiệm:

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

});

Trân trọng.

một lớp lót đơn giản khác:

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

Nếu bạn không thể có các mục OBJ bằng null, bạn có thể làm điều này:

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

và trong quan điểm bạn có thể làm:

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

Bạn có thể làm

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

Chỉ khi trình duyệt của bạn hỗ trợ ECMAScript 5. Ví dụ, IE 8 không hỗ trợ tính năng này.

Xem http://kangax.github.io/compat-table/es5/ để biết thêm thông tin

if( obj[0] )

một phiên bản rõ ràng hơn của điều này có thể là:

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

trong đó kết quả sẽ không được xác định nếu không có thuộc tính đối tượng nào được đặt.

Hoặc, nếu sử dụng lo-dash: _.empty (value).

"Kiểm tra xem giá trị có trống không. Các đối tượng mảng, chuỗi hoặc đối số có độ dài bằng 0 và các đối tượng không có thuộc tính liệt kê riêng được coi là" trống "."

Kiểm tra đối tượng rỗng

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

bạn có thể kiểm tra độ dài của các mặt hàng

ng-show="items.length"