Angularjs 角度：ng绑定html筛选出ng点击？

我有一些从json文件加载的html数据

我在应用程序中使用Ngsanize和ng bind html来显示这些html数据

现在，我想将json blob中的任何链接从标准转换为

致：

• 
  有什么想法吗？
  好的，问题是它没有编译包含的html（angular没有解析它以查找指令等等）。想不出从控制器内部编译的方法，但您可以创建一个包含内容的指令，并对其进行编译
  
  所以你会改变
  
  <p ng-bind-html="name"></p>
  
  
  
  到
  
  
  
  然后对于js：
  
  var myApp = angular.module('myApp', ['ngSanitize']);
  angular.module('myApp')
  .directive('compile', ['$compile', function ($compile) {
    return function(scope, element, attrs) {
      scope.$watch(
        function(scope) {
          return scope.$eval(attrs.compile);
        },
        function(value) {
          element.html(value);
          $compile(element.contents())(scope);
        }
     )};
    }]).controller('MyCtrl', function($scope) {
      var str = 'hello http://www.cnn.com';
      var urlRegEx = /((([A-Za-z]{3,9}:(?:\/\/)?)(?:[\-;:&=\+\$,\w]+@)?[A-Za-z0-9\.\-]+|(?:www\.|[\-;:&=\+\$,\w]+@)[A-Za-z0-9\.\-]+)((?:\/[\+~%\/\.\w\-]*)?\??(?:[\-\+=&;%@\.\w]*)#?(?:[\.\!\/\\\w]*))?)/g;
      result = str.replace(urlRegEx, "<a ng-click=\"GotoLink('$1',\'_system\')\">$1</a>");
      $scope.GotoLink = function() { alert(); }
      $scope.name = result;
  });
  
  var myApp=angular.module（'myApp'，['ngSanitize']）；
  angular.module（'myApp'）
  .directive（'compile'，['$compile'，函数（$compile）{
  返回函数（范围、元素、属性）{
  范围.$watch(
  职能（范围）{
  返回范围$eval（attrs.compile）；
  },
  函数（值）{
  html（值）；
  $compile（element.contents（））（范围）；
  }
  )};
  }]).controller（'MyCtrl'，函数（$scope）{
  var str='你好http://www.cnn.com';
  var urlRegEx=/（（[A-Za-z]{3,9}:（？：\/\/）（？：[\-；：&=\+\$，\w]+-）[A-Za-z0-9\.\-]+\；（？：www\.[\-；：&=\+$，\w]+.[A-Za-z0-9\-]+（？：\/[\/[\%\-/\%\.\w]-]*）（？：[\+++++--/\\\-%.-/.--%.[\\-%.-/.-%.-/.-%.*）*）（？：[\+++--------/.-----.---------.-/.]；
  结果=str.replace（urlRegEx，“
  
  Angular 1.4.3：（与以前的代码相同，但有些人说它在1.4上不起作用。*）
  明确信任HTML和
  $sce
  当您希望Angular将模型数据呈现为HTML而不需要任何问题时，您需要的是
  $sce
  服务。
  $sce
  是严格的上下文转义服务–一个奇特的服务名称，它可以用一个对象包装HTML字符串，告诉Angular的其余部分HTML可以在任何地方呈现
  
  在以下版本的控制器中，代码要求使用
  $sce
  服务，并使用该服务使用
  $sce.trustAsHtml将链接数组转换为受信任的HTML对象数组。
  
  app.controller('XYZController', function ($scope, $sce) {
  
  $sce.trustAsHtml("<table><tr><td><a onclick='DeleteTaskType();' href='#workplan'>Delete</a></td></tr></table>");
  
  app.controller（'XYZController'，函数（$scope，$sce）{
  $sce.trustAsHtml（“”）；
  我在编译时仍然面临一些问题，因为这不能满足我的要求。因此，有一个非常好且简单的方法来解决这个问题
  
  当onClick工作时，我们将ng click替换为onClick，然后编写一个javascript函数并在onClick事件上调用它。
  在onClick函数中，我们找到锚标记的作用域，并显式调用所需的函数
  
  下面是它是如何完成的：）
  
  早些时候
  
  <a id="myAnchor" ng-click="myControllerFunction()" href="something">
  
  ng bind html不安全工作吗？没有。那么根本就没有输出。可能的重复工作很好，谢谢！正如我所想（我不太清楚我是否正确理解$sce，文档有点不清楚）但是不可能浏览到白名单，以便通过ng bind html输出吗？这在angular 1.4.3抛出错误”错误中对我不起作用：[$rootScope:infdig]10$digest（）迭代已达到。正在中止！"在其他答案中也看到了此解决方案。但在1.4中对我不起作用。*如果这对你不起作用，请检查你要调用的方法是否确实在你的范围内，取决于指令的范围规则，它可能在父项上。不，这绝对不是做这件事的方式，不可测试，是一个令人讨厌的解决方法冷静点，兄弟，我可以做“这样，你怎么能不测试它呢？我不是在上面提到了它作为解决办法吗？冷静点，兄弟，如果可能的话，请消除你对否决票的愤怒？”Satys把你投了回去，因为你确实提到了这是一个问题workaround@KuraiBankusu感谢you@LucaTrazzi漫游通常是令人讨厌的。将onclick处理程序附加到一个元素。如果在代码段中使用ng click而不是onclick，这将不起作用。@mnashihan那么您将如何使用$sce处理ng click？
  <a id="myAnchor" ng-click="myControllerFunction()" href="something">
  
  <a id="myAnchor" onClick="tempFunction()" href="something">
  
  <script>
  function tempFunction() {
   var scope = angular.element(document.getElementById('myAnchor')).scope();
    scope.$apply(function() {
      scope.myControllerFunction();
   });
  }
  </script>