包含指令

Question

在我的網站上顯示的文字，我想規範鏈接到其他人看起來像這樣，所以我做了它一個指令：

<my-person id="1"></my-person> 

和

app.directive('myPerson', function() { 
    return { 
    restrict: 'E', 
    replace: 'true', 
    template: '<a href="#/person/{{person.id}}">{{person.name}}</a>', 
    scope: { 
     person_id : '=id', 
    }, 
    controller: function($scope, Repository) { 
     Repository.getPerson($scope.person_id).then(function(p) { 
      $scope.person = p; 
     }); 
    }, 
    }; 
}); 

該作品好。

但是在下一步，我希望用戶寫新聞，並在他們想要引用其他人的新聞。所以基本上，我想顯示一個文本

'I met <my-person id="42"></my-person> yesterday.' 

但當angularjs顯示我的新聞條目的背景下，然後將HTML標籤轉義，當然，它也不會被編譯。

有沒有簡單的方法來實現這一目標？這裏是一個jsfiddle，顯示我的問題：jsfiddle link

Answer 1

您將需要在ng-repeat塊內編譯你的html。

爲了使像下面

app.directive('bindHtmlCompile', ['$compile', function ($compile) { 
     return { 
      restrict: 'A', 
      link: function (scope, element, attrs) { 
       scope.$watch(function() { 
        return scope.$eval(attrs.bindHtmlCompile); 
       }, function (value) { 
        element.html(value); 
        $compile(element.contents())(scope); 
       }); 
      } 
     }; 
    }]); 

現在裏面你的NG-重複你的指令添加到跨度這樣的指令：

<span class="row" bind-html-compile="newsEntry.text"></span> 

工作代碼here

參考here