List Divider by given parameter


#1

Hi, I´d like to implement a list of restaurants. Therefore I got a service who handles this json data:

var restaurants = [
{"ID":1,"Name":"Restaurant 5","Ort":"Frauenfeld"},
{"ID":2,"Name":"Restaurant Ban Kinnaree","Ort":"Diessenhofen"},
{"ID":3,"Name":"Falken – Pub, Bar, Restaurant & Motel","Ort":"Frauenfeld"},
{"ID":4,"Name":"Gasthaus zum goldenen Kreuz","Ort":"Frauenfeld"},........

Now In my list (I use collection repeat) there should be a divider for the attribute “Ort”. So everytime when the “Ort” of the restaurant is eg. “Frauenfeld” it should show a divider named “Frauenfeld” and show all restaurants in "Frauenfeld underneath. Some help would be amazing :wink:

this is the collection repeat directive I use:

<div class="list">
    <a class="item my-item"
      collection-repeat="restaurant in restaurants | filter:searchText"
      collection-item-width="'100%'"
      collection-item-height="getItemHeight(item, $index)"
      ng-style="{height: getItemHeight(item, $index)}"
      ng-href="#/detail/{{restaurant.ID-1}}">
      {{restaurant.Name}}
      <p>{{restaurant.Ort}}</p>
    </a>
  </div>