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

【问题标题】：How to append more result from YouTube API and append to a div with AngularJS?如何从 YouTube API 附加更多结果并使用 AngularJS 附加到 div？
【发布时间】：2017-04-13 15:36:36
【问题描述】：

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

CodePen my example

codePen中的页面并没有编译Angular变量，所以我会解释。该页面在左侧加载一个视频，在右侧加载一个视频列表，它正在工作，但我需要制作一个按钮来加载该列表中的更多视频。

我用文本尝试这个，它附加了相同的结果，如果我尝试显示一个图像，它会阻塞 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>';                    
  }

【问题讨论】：

标签： javascript angularjs

【解决方案1】：

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

【讨论】：

谢谢，我改了，这工作，我知道什么是模板，但我不明白如何绑定，你有一个例子吗？ codepen.io/Gisesonia/pen/OpGRzp
现在我又发现了一个问题，ng-bind-html中的函数不起作用，我找到了一些答案，但是我不知道在这种情况下如何应用。示例：link。我正在尝试使用 append 加载视频，因为如果这不是一个好的做法，我应该怎么做。