AngularJS + JQuery: Jak uzyskać dynamiczną pracę z angularjs

Pracuję nad aplikacją Ajax przy użyciu zarówno jQuery, jak i AngularJS.

Kiedy aktualizuję zawartość (która zawiera powiązania AngularJS) div używając jQuery'shtml funkcja, powiązania AngularJS nie działają.

Oto kod tego, co próbuję zrobić:

$(document).ready(function() {
  $("#refreshButton").click(function() {
    $("#dynamicContent").html("<button ng-click='count = count + 1' ng-init='count=0'>Increment</button><span>count: {{count}} </span>")
  });
});
</style><script src="http://docs.angularjs.org/angular-1.0.1.min.js"></script><style>.ng-invalid {
  border: 1px solid red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="">
  <div id='dynamicContent'>
    <button ng-click="count = count + 1" ng-init="count=0">
        Increment
      </button>
    <span>count: {{count}} </span>
  </div>


  <button id='refreshButton'>
    Refresh
  </button>
</div>

Mam dynamiczną zawartość wewnątrz div z identyfikatorem#dynamicContenti mam przycisk odświeżania, który aktualizuje zawartość tego div po kliknięciu odświeżania. Przyrost nie działa zgodnie z oczekiwaniami, jeśli nie odświeżam zawartości, ale po odświeżeniu powiązanie AngularJS przestaje działać.

Może to nie być poprawne w AngularJS, ale początkowo zbudowałem aplikację z jQuery i zacząłem używać AngularJS później, więc nie mogę przenieść wszystkiego do AngularJS. Każda pomoc w uzyskaniu tego w AngularJS jest bardzo mile widziana.

questionAnswers(3)

yourAnswerToTheQuestion