Angularjsモデルが私のmathjax-bindで動作しません

Question

文字列内に入力テキストがあり、##〜<input type="text" />のような文字があれば変換する必要があります。 ng-bind-htmlを使用した場合、値を返すことは問題ありません。ただしmathjax-bindを使用してng-modelの値が返されませんでした。

この問題を解決するにはどうすればよいですか？ありがとう。

---

HTMLコード：

<script type="text/x-mathjax-config"> MathJax.Hub.Config({ tex2jax: {inlineMath: [['`','`'], ['\\(','\\)']]} }); </script> 

<div ng-controller="MyCtrl"> 
\(-3\times 4=\) 

<br/> 
<br/> 
<br/> 

    <div mathjax-bind="output"> 
    </div> 
    <br/> 
    <button ng-click="check_answer()"> 
    Check Answer 
    </button> 
</div> 

コントローラー：

var myApp = angular.module('myApp',[]); 

myApp.directive("mathjaxBind", function() { 
     return { 
      restrict: "A", 
      controller: ["$scope", "$element", "$attrs", 
       function($scope, $element, $attrs) { 
        $scope.$watch($attrs.mathjaxBind, function(texExpression) { 
         $element.html(texExpression); 
         MathJax.Hub.Queue(["Typeset", MathJax.Hub, $element[0]]); 
        }); 
       }] 
     }; 
    }); 

//myApp.directive('myDirective', function() {}); 
//myApp.factory('myService', function() {}); 

function MyCtrl($scope) { 
    $scope.form = {}; 
    var output = 'Answer: <br/> ##'; 
    $scope.output = output.replace('##','<input type="text" ng-model="form.data.input1" />'); 

    $scope.check_answer = function() 
    { 
     alert($scope.form.data.input1); 
    } 
} 

Mathjax-bind with angularjs model fiddle

Answer 1

私は解決策を得ました。

myApp.directive("mathjaxBind", function($compile) { 
     return { 
      restrict: "A", 
      controller: ["$scope", "$element", "$attrs", 
       function($scope, $element, $attrs) { 
        $scope.$watch($attrs.mathjaxBind, function(texExpression) { 
         $element.html(texExpression); 
         $compile($element.html(texExpression).contents())($scope); 
         MathJax.Hub.Queue(["Typeset", MathJax.Hub, $element[0]]); 
        }); 
       }] 
     }; 
    }); 

ここworking fiddleだ：私はちょうど...再びコンパイルするコードが必要です。