Angular.js中的自定义过滤器,带有ng-repeat

时间:2014-06-10 03:58:33

标签: javascript angularjs

我有像这样的json

[
    {
        "itemId": 1062,
        "businessType": "SPORT",
        "name": "Modern Martial Arts Vitor Shaolin Brazilian Jiu Jitsu",
        "websiteUrl": "http://www.yelp.com/biz/modern-martial-arts-vitor-shaolin-brazilian-jiu-jitsu-new-york",
        "rating": 5,
        "city": "New York",
        "address": "780 8th Ave (b/t 47th St & 48th St) Hell's Kitchen New York NY 10036",
        "imageUrl": "http://s3-media3.ak.yelpcdn.com/bphoto/JHk9p_jYX1QpQN4Im-p3jA/ms.jpg",
        "source": "Yelp",
        "longitude" : -42.005,
        "latitude" : 65.007,
        "itemType": "Business",
        "suggestionCriteria": "like",
        "suggestedBy": "Self",
        "suggestingUser": {
            "userId": 1,
            "firstName": "Gaurav",
            "lastName": "Shandilya",
            "imageUrl": "http://54.243.29.6:8080/UploadedImages/1_1401692790212_Ashish"
        }
    },
    {
        "itemId": 8227,
        "businessType": "SPORT",
        "name": "TGA of Bergen County",
        "websiteUrl": "http://www.golftga.com/Default.aspx?alias=www.golftga.com/bergencounty",
        "city": "Wayne",
        "address": "17 North Jersey Lane Wayne NJ 07470 USA",
        "source": "Groupon",
        "longitude" : -42.005,
        "latitude" : 65.007,
        "itemType": "Business",
        "suggestionCriteria": "like",
        "suggestedBy": "Self",
        "suggestingUser": {
            "userId": 1,
            "firstName": "Gaurav",
            "lastName": "Shandilya",
            "imageUrl": "http://54.243.29.6:8080/UploadedImages/1_1401692790212_Ashish"
        }
    },
    {
        "itemId": 3932,
        "businessType": "SPORT",
        "name": "Willowbrook Golf Center",
        "websiteUrl": "http://www.willowbrookgolfcenter.com",
        "city": "North Jersey",
        "address": "17 North Jersey Lane Wayne NJ 07470 USA",
        "source": "Groupon",
        "longitude" : -42.005,
        "latitude" : 65.007,
        "itemType": "Business",
        "suggestionCriteria": "like",
        "suggestedBy": "Self",
        "suggestingUser": {
            "userId": 1,
            "firstName": "Gaurav",
            "lastName": "Shandilya",
            "imageUrl": "http://54.243.29.6:8080/UploadedImages/1_1401692790212_Ashish"
        }
    },
    {
        "itemId": 3918,
        "businessType": "SPORT",
        "name": "Church Street Boxing Gym & Pouncing Tigers",
        "websiteUrl": "http://www.csboxinggym.com/",
        "city": "New York City",
        "address": "201207 West 42nd Street New York NY 10036 USA",
        "source": "Groupon",
        "itemType": "Business",
        "suggestionCriteria": "like",
        "suggestedBy": "Self",
        "suggestingUser": {
            "userId": 1,
            "firstName": "Gaurav",
            "lastName": "Shandilya",
            "imageUrl": "http://54.243.29.6:8080/UploadedImages/1_1401692790212_Ashish"
        }
    },
    {
        "itemId": 1100,
        "businessType": "SPORT",
        "name": "CKO Kickboxing Carroll Gardens",
        "websiteUrl": "http://www.yelp.com/biz/cko-kickboxing-carroll-gardens-brooklyn-2",
        "rating": 4,
        "city": "Brooklyn",
        "address": "562 Court St (b/t Hamilton Ave & Garnet St) Carroll Gardens Brooklyn NY 11231",
        "imageUrl": "http://s3-media2.ak.yelpcdn.com/bphoto/guwuh08U_tYTyRsjLQIJ-w/ms.jpg",
        "source": "Yelp",
        "itemType": "Business",
        "suggestionCriteria": "like",
        "suggestedBy": "Self",
        "suggestingUser": {
            "userId": 1,
            "firstName": "Gaurav",
            "lastName": "Shandilya",
            "imageUrl": "http://54.243.29.6:8080/UploadedImages/1_1401692790212_Ashish"
        }
    },
    {
        "itemId": 462,
        "businessType": "SPORT",
        "name": "TITLE Boxing Club",
        "websiteUrl": "http://www.titleboxingclub.com",
        "city": "Wayne",
        "address": "Wayne NJ 07470 USA",
        "source": "Groupon",
        "itemType": "Business",
        "suggestionCriteria": "like",
        "suggestedBy": "Self",
        "suggestingUser": {
            "userId": 1,
            "firstName": "Gaurav",
            "lastName": "Shandilya",
            "imageUrl": "http://54.243.29.6:8080/UploadedImages/1_1401692790212_Ashish"
        }
    },
    {
        "itemId": 474,
        "businessType": "SPORT",
        "name": "Centercourt Athletic Club of Morristown",
        "websiteUrl": "http://www.centercourtclub.com/club/scripts/section/section.asp?CLNK=1&NS=CMT",
        "city": "Wayne",
        "address": "Wayne NJ 07470 USA",
        "source": "Groupon",
        "itemType": "Business",
        "suggestionCriteria": "like",
        "suggestedBy": "Self",
        "suggestingUser": {
            "userId": 1,
            "firstName": "Gaurav",
            "lastName": "Shandilya",
            "imageUrl": "http://54.243.29.6:8080/UploadedImages/1_1401692790212_Ashish"
        }
    },
    {
        "itemId": 3326,
        "businessType": "SPORT",
        "name": "Legends Baseball Instruction",
        "websiteUrl": "http://www.legendsbaseballinstruction.com",
        "city": "North Jersey",
        "address": "17 North Jersey Lane Wayne NJ 07470 USA",
        "source": "Groupon",
        "itemType": "Business",
        "suggestionCriteria": "like",
        "suggestedBy": "Self",
        "suggestingUser": {
            "userId": 1,
            "firstName": "Gaurav",
            "lastName": "Shandilya",
            "imageUrl": "http://54.243.29.6:8080/UploadedImages/1_1401692790212_Ashish"
        }
    },
    {
        "itemId": 1104,
        "businessType": "SPORT",
        "name": "Adirondack Sailing",
        "websiteUrl": "http://www.yelp.com/biz/adirondack-sailing-new-york",
        "rating": 4,
        "city": "New York",
        "address": "62 Chelsea Piers New York NY 10011",
        "imageUrl": "http://s3-media1.ak.yelpcdn.com/bphoto/FwpUOlPWSpLlEteBGukcpg/ms.jpg",
        "source": "Yelp",
        "itemType": "Business",
        "suggestionCriteria": "like",
        "suggestedBy": "Friend",
        "suggestingUser": {
            "userId": 4,
            "firstName": "Ashish",
            "lastName": "Chandra",
            "imageUrl": "http://54.243.29.6:8080/UploadedImages/4_1400934645640_Ashish"
        }
    },
    {
        "itemId": 1709,
        "businessType": "SPORT",
        "name": "Manhattan Sailing Club",
        "websiteUrl": "http://www.yelp.com/biz/manhattan-sailing-club-new-york",
        "rating": 4,
        "city": "New York",
        "address": "385 S End Ave Ste 6H Battery Park New York NY 10280",
        "imageUrl": "http://s3-media1.ak.yelpcdn.com/bphoto/9yvzeSYaKfguvDUzF69xvw/ms.jpg",
        "source": "Yelp",
        "itemType": "Business",
        "suggestionCriteria": "like",
        "suggestedBy": "Friend",
        "suggestingUser": {
            "userId": 4,
            "firstName": "Ashish",
            "lastName": "Chandra",
            "imageUrl": "http://54.243.29.6:8080/UploadedImages/4_1400934645640_Ashish"
        }
    }
]

我在ng-repeat的帮助下在列表中显示了这个。我想制作一个自定义过滤器,用户可以根据距离(如果长和拉特在那里)从他当前的位置,价格,评级和(自我或frd)建议过滤列表 请帮我找到解决方案

以下是Plunker link

1 个答案:

答案 0 :(得分:0)

您可以使用函数作为filter的第一个参数,以获得更复杂的过滤器。例如,您可以在控制器中指定:

    $scope.filterFn = function (o) {
        return (o.price > 10) && ((o.longitude - user.longitude) < 2) && (o.itemType === 'Business');
    }

您的过滤器函数将接收当前列表项作为其第一个参数。如果它返回true,则过滤后的列表将包含当前项。

有关详细信息,请参阅:https://docs.angularjs.org/api/ng/filter/filterexpression参数作为函数)