ตรวจสอบว่าวัตถุว่างเปล่าใช้ได้กับ ng-show แต่ไม่ใช่จากคอนโทรลเลอร์?

ฉันมีวัตถุ JS ที่ประกาศเช่นนั้น

$scope.items = {};

ฉันยังมีคำขอ $ http ที่เติมสิ่งของนี้ด้วยรายการ ฉันต้องการตรวจสอบว่ารายการนี้ว่างเปล่าหรือไม่ปรากฏว่า ng-show รองรับสิ่งนี้ ... ฉันป้อน

ng-show="items"

และมันใช้งานได้อย่างน่าอัศจรรย์ฉันก็อยากจะทำเช่นเดียวกันจากคอนโทรลเลอร์ แต่ดูเหมือนจะใช้งานไม่ได้ดูเหมือนว่าฉันอาจต้องทำซ้ำบนวัตถุเพื่อดูว่ามีคุณสมบัติหรือไม่ใช้ lodash หรือขีดล่าง .

มีทางเลือกอื่นไหม

ฉันไม่ได้ลอง

alert($scope.items == true);

แต่จะคืนค่าเป็นเท็จเสมอเมื่อวัตถุถูกสร้างขึ้นและเมื่อมีการเติมข้อมูล$httpดังนั้นจึงไม่ทำงานในลักษณะนั้น

ไม่จำเป็นต้องใช้ตัวอักษรวัตถุว่างที่นี่คุณสามารถใช้ค่าว่างหรือไม่ได้กำหนด:

$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"