Question

我试图用html文本调用一个角度指令，我将这样添加到我的控制器中，

var loadReviews=function(){
var theDiv=$("#rlist")
   for(var i=0; i<vm.reviewlistByUpvote.length; i++){
       var review=vm.reviewlistByUpvote[i];
       var html='<a star-directive ng-model="review.overall" data-size="xs" data-disabled="true"> </a>';
       theDiv.append(html)
 };
};

我的指示如下，

angular.module('App')
.directive('starDirective', function() {
return {
  restrict: 'A',
  // templateUrl: 'views/star.html',
  link: function(scope, element, attrs, ngModel) {
        $(element).rating(scope.$eval(attrs.starRating));

              // get value from ng-model
        ngModel.$render = function() {
            $(element).rating('update', ngModel.$viewValue || '');
        }



          $(element).on('rating.change', function(event, value, caption) {
            ngModel.$setViewValue(value);
        });
         }


   };
 });

然而，该指令不会编译。如果我在我的html中加载star指令，它工作正常，但通过这种方法，没有任何东西被加载。我已经查看了$ compile，但它没有解决问题，但我可能错误地应用了它。

Answer 1

我会避免手动将指令添加到html中，我建议让angular负责添加html内容。

现在有些情况下你需要附加html内容（比如在模态中），在这种情况下你需要在附加html之前使用$ compile服务编译html，然后分配一个范围（它可以是一个新的或同一个）

以下是Ben Lesh关于如何做到这一点的一个很好的例子： http://www.benlesh.com/2013/08/angular-compile-how-it-works-how-to-use.html

通过append方法调用angular指令

1 个答案: