javascript - 与Grails <g:each>合并重复的列表中的JSON数据

Question

我正在页面上从JSON源显示音乐会的动态列表。这些文件也已从此源添加到我的数据库中，但由于各种原因，未从此页面上的数据库中显示。

我想在通过JSON显示的音乐会列表中包括每个数据库音乐会的显示页面的链接。

这将获取我的JSON演唱会:

  function fetch(){      
if($scope.search == "" || $scope.search == null){
  $.getJSON("http://api.bandsintown.com/events/search.json?&api_version=2.0&app_id=FYP&location=Dublin,Ireland", function(result) 
  {
    $scope.$apply(function()
    {
      $scope.details = result;

      changeDate();
    }, 0);
  });    
}

该JSON的演唱会是接下来的50个演出，因此我已经获得了指向显示页面的链接，该链接指向我数据库中最近50个演唱会条目，它们将与JSON匹配，如下所示:

    def index() 
{
    int eventCount = Event.count()
    int startingPoint = eventCount - 50

    def events = Event.createCriteria().list
    {
        order('id')
        firstResult(startingPoint)
        maxResults(50)
    }

    respond events
}

尝试将JSON和show链接结合在一起会导致两个循环发生冲突，并且页面上显示50 x 50的列表结果-每个JSON条目都有一个指向每个show的链接，反之亦然。

  <ul class="rel-results"> 
  <g:each in="${eventInstanceList}" status="i" var="eventInstance">
    <li ng-repeat="show in details">
        <!-- SHOW LINKS -->
        <g:link action="show" controller = "Event" id="${eventInstance.id}">Info</g:link>

        <div class = "event-date-time">{{ show.datetime }}</div>

        <div class = "event-item">  
          <div class = "nameAndTicket row" style="margin-left: 0;margin-right: 0">
            <span class="artist-name col-md-10">
              <a href="#/" id="{{ $index + 1 }}" ng-click="update(show)" class = "artist-item">
                  {{ show.artists[0].name }}
              </a>
            </span>

          </div>

          <div class="venueAndRSVP row" style="margin-left: 0;margin-right: 0">
            <span class="venue-name col-md-10">
              <a href="#/" id="{{ $index + 1 }}" ng-click="update(show)" class = "venue-item">           
                <div style = "text-transform: lowercase;display: inline-block;color: red;font-size: 80%;">at</div> {{ show.venue.name }}  {{ show.formatted_location }}
              </a>
            </span>
          </div>
        </div>
    </li>
    </g:each>
  </ul>

我已经尝试过使用Angular独特的过滤器甚至是骇人的JS来删除页面上的重复链接，但是我认为这些是错误的想法。我觉得我需要以某种方式组合g:each和ng-repeat-实际上这样做是行不通的。

任何帮助将不胜感激!

编辑以添加事件域

class Event implements Rateable, Commentable  {


int bandsintown_id
String artist
String venue
String ticket_url
String ticketStatus
String eventTime
String livestream

static constraints = 
{
    bandsintown_id unique:true
    livestream nullable:true

}

Answer 1

来自json的ID存储在您的Event域中，这是将2链接在一起的最好/最独特的方法，这对我有用...
EventController

def showByBandId() {
    def event = Event.findByBandsintown_id( params.id )
    // add some error handling here in case event isn't found
    redirect ( action: 'show', id: event.id )
}

homepage.gsp

<div id="related_results">
    <g:render template="partials/shows" />
</div>

shows.gsp

...
<li ng-repeat="show in details">
<a ng-href="${createLink( controller: 'event', action: 'showByBandId' )}/{{show.id}}">Info</a>
....