Javascript 绑定ng单击ng绑定html:：绑定html中的角度属性

我有一个基于导航堆栈动态更改的HTML代码。我正在使用

ng bind html

将包含代码的字符串插入到视图中。现在我需要能够将ng click属性输入到视图中。一切正常，除了没有注入

ng click

属性，因此我无法在面包屑中快速导航

以下是我传递给视图的HTML：

$scope.breadcrumbs = $scope.breadcrumbs + '&nbsp;<i class="ion-ios-arrow-forward"></i>&nbsp;' + '<span ng-click="goToLevel(pathLength)" class="browse-breadcrumbs-link">' + $scope.title + '</span>';

$scope.breadcrumbs=$scope.breadcrumbs+''+''+$scope.title+''；

---

该类被应用，但ng click属性被忽略。我错过了什么？谢谢。

如果你看一下

ngbindhtml

API，你就会知道它只解析html并使用

元素将其作为文本附加到DOM中。text

。添加的html将不会有任何编译的DOM。它将像普通标记一样工作

我建议您通过将面包屑放在

breadcrumb

元素上来处理面包屑。这样您就可以在指令链接函数中控制DOM。创建面包屑html后，您需要首先编译该html，然后使用

$compile

服务将其附加到

面包屑

DOM

代码

link: function(scope, element, attrs){
   //you code would something like below..
   //create an html
   scope.breadcrumbs = scope.breadcrumbs + '&nbsp;<i class="ion-ios-arrow-forward"></i>&nbsp;' + '<span ng-click="goToLevel(pathLength)" class="browse-breadcrumbs-link">' + $scope.title + '</span>';
   element.empty();
   element.append($compile(scope.breadcrumbs)(scope))
}

链接：函数（范围、元素、属性）{
//您的代码如下所示。。
//创建一个html
scope.breadcrumbs=scope.breadcrumbs+''+'+'+$scope.title+''；
元素。empty（）；
元素.append（$compile（scope.breadcrumbs）（scope））
}

从面包屑的语法来看，它似乎可以被简单的

ng repeat

替换，并将html保留在视图层，即

控制器 在那里，Newcrump将是一个包含所有您需要的信息的对象

看法

{{crumb.title}

您应该创建一些处理面包屑的指令。@Joãocolas这是如何工作的？我可以进入n个级别，数据是从服务器动态创建的，因此我无法提前知道需要多少字符串。我确信，如果您只需将下一个面包屑推入数组，并通过所述数组重复生成nice，这将更加容易breadcrumbs@maurycy我会给它一个try@maurycy啊对,这么简单,，我是创建复杂解决方案的专家：P谢谢

  $scope.breadcrumbs.push(newCrumb)

<span ng-repeat="crumb in breadcrumbs">
  &nbsp;<i class="ion-ios-arrow-forward"></i>
  &nbsp;<span ng-click="goToLevel(pathLength)" class="browse-breadcrumbs-link">{{crumb.title}}</span>
</span>