ng-bind-html中的angular命令

Question

我正在嘗試使用$interpolate和ng-bind-html通過此答案將我的范圍變量的數據綁定到html字符串。 現在，當我的范圍變量的值正在更新ng-bind-html結果時，它不會更新。

我不想每次范圍更新時都調用$interpolate 。

這是我的控制器代碼：

$scope.TitleFlag= true;
$scope.HtmlContent = "<div>{{TitleFlag}}</div>";
$scope.trustedHtml = $interpolate($scope.HtmlContent)($scope);
$scope.TitleFlagToggle = function(){
    $scope.TitleFlag= !$scope.TitleFlag;
  };

這是我的查看代碼：

<div>{{TitleFlag}}</div> <!-- This is update correctly -->
<div ng-bind-html="trustedHtml"></div> <!-- This is not update -->
<button class="button" ng-click="TitleFlagToggle()"></button>

Answer 1

當TitleFlag更改時，我們需要對其進行插值。 因此，也將$ scope.trustedHtml也放在click函數中。

$scope.TitleFlag= true;
$scope.HtmlContent = "<div>{{TitleFlag}}</div>";
$scope.trustedHtml = $interpolate($scope.HtmlContent)(  $scope);
$scope.TitleFlagToggle = function(){
  $scope.TitleFlag= !$scope.TitleFlag;
  $scope.trustedHtml = $interpolate($scope.HtmlContent)(  $scope);
};

http://plnkr.co/edit/rRjHOY2xSiAZ8EtzviqK?p=preview