Javascript 如何从YouTube API附加更多结果并使用AngularJS附加到div？

我有一个在CodePen中开发的示例：

codePen中的页面不是编译角度变量，因此我将解释。页面在左侧加载一个视频，在右侧加载一个视频列表，它正在工作，但我需要制作一个按钮，在该列表中加载更多视频

我尝试使用文本，它会附加相同的结果，如果我尝试显示图像，它会阻塞url，错误为$sanitize:badparse:

$scope.divHtmlVar = '';
      $scope.carregaMais = function( itemId, nextPage) {     
      YoutubeService.getPlaylistItems(itemId, nextPage);         
      $scope.divHtmlVar = $scope.divHtmlVar + '<div class="col-xs-12 col-sm-8 col-md-4 col-lg-6"><a href="#"><img class="img-responsive" src=' + $scope.thumb+ 'alt="Video Image"><br/><i>'+nextPage+'</i>';                    
  }

$scope.divHtmlVar=''；
$scope.carregaMais=函数（itemId，nextPage）{
YoutubeService.GetPlayItems（itemId，下一页）；
$scope.divHtmlVar=$scope.divHtmlVar+'
'+nextPage+''；
}

您不应该在angular应用程序中真正注入HTML。只需创建一个模板并将其绑定到控制器。例如，您的视频列表将有一个标记，它使用ng repeat呈现数据列表。关于ng sanitize，如果它过滤出了您不想过滤的内容，请检查文档并更改其配置。

谢谢，我更改了，这很有效，我知道什么是模板，但我不知道如何绑定，您有示例吗？现在我发现了另一个问题，这些函数在ng bind html中不起作用，我找到了一些答案，但我不知道如何在这种情况下应用。示例：。我正在尝试用append加载视频，因为它一次加载5个，如果这不是一个好的实践，我应该怎么做。