CODEWITHSUNDEEP
angularjs
Mishaa
Mishaa

Reputation: 97

How Filter ng-options base on property in array property of object

I'm Using ng-options for fill my comb-box.I want to filter comb-box base on property of option which is array of class, I want to show option that the property contain the value I want.

I have Two comb-box, One of them List of hotel, other is list of the user which has list of Hotel they have access. I want when option in Hotel comb-box change the user com-box option show users that in listofhotelsaccses has hotel that its Id is equal with selected Hotel or isadmin property is true. in C# I can use ' lstUserVm.Where(q => q.LstAccessHotelVms.Any(x => x.HotelID == hotelid) || q.IsAdmin == true).ToList();' in angular I am amateur. I don't know how to filter the list. 

class AccessHotel
{
 public int HotelID { get; set; }
 public string HotelName { get; set; }
 public bool AccessFlag { get; set; }
}

class User
{
public string FirstName { get; set; }
public string LastName { get; set; }
public string FullName { get; set; }
public bool IsAdmin { get; set; }
public List<AccessHotelVm> LstAccessHotelVms { get; set; }
}
class Hotel
{
public int HotelID { get; set; }
public string HotelName { get; set; }
}

 <select class="form-control  "  id="mHotel" name="mHotel" ng-model="mHotel" data-ng-options="Hotel.HotelID as Hotel.Name for Hotel in  LstHotel" 
></select>
  <select class="form-control "  id="mUser" name="mUser" ng-model="mUser" data-ng-options="user.Id as user.FullName for user in  LstUser " ></select>

I want To Change in hotel result in option in User but I Don't know how to filter it In angular.

Upvotes: 1

Views: 194

Answers (2)

Vinod Bokde
Vinod Bokde

Reputation: 338

I used something like this for Country and State filtering in my Project.

<select ng-model="userState" ng-options="state.name for state in ( states | filter: {country: { code: userCountry.code }}) track by state.name">

Try this Fiddle:

It'll help.

Click to view Fiddle.

Upvotes: 1

NTP
NTP

Reputation: 4448

You can use ng-change directive on your first select to call a function when user selects a value.

 <select class="form-control" ng-change="filterUsers()" id="mHotel" name="mHotel" ng-model="mHotel" data-ng-options="Hotel.HotelID as Hotel.Name for Hotel in LstHotel"></select>

inside your filterUsers function you can filter LstUser according to the value selected.

  • $scope.mHotel contains the selected value from your first select
  • $scope.LstUser is the list that your select is populated with

You can update LstUser according to the selected value to only show the relevant items. 

$scope.filterUser = function(){
    // write your filter logic here
}

Upvotes: 1

Related Questions