ng-show/hide dinamik olarak eklenen html üzerinde çalışmıyor

Question

Dinamik HTML (aşağıdakine benzer) eklemek ve ng-show/hide çalışmasını doğru şekilde yapmak mümkün mü?

Etrafta bir iş yapmak istediğim arsaları bulmak ve .show() /. Hide() uygun şekilde bulmak.

Arka plan: Dinamik olarak bir sayfada (Highcharts kullanarak) 'HTML için' space-for-HC 'alanına yapılan grafikleri ekliyorum. Ağırlıklı ve ağırlıksız dereceler gösteriyorum. Ben bir onay kutusu (ng model = 'Ağırlıklı ") kullanarak bu araziler verişi istiyorum

JS:.

$scope.plot_it_all = function(response) { 
    let schools = Object.keys(response.data); 
    schools.forEach(function(school){ 
     angular.element(document.getElementById('space-for-HC')).append(

'<div>' + 
' <div class="ng-scope" ng-hide="Weighted" id="HC-container-grades-' + school + '" style="min-width: 600px; max-width: 800px; height: 400px; margin: 0 auto"></div>' + 
' <div class="ng-scope" ng-show="Weighted" id="HC-container-grades-weighted' + school + '" style="min-width: 600px; max-width: 800px; height: 400px; margin: 0 auto"></div>' + 
'</div>' 

     ); 
     $scope.plot_school(school, response); 
    }); 
}; 

Yasal Uyarı: Bu benim ilk açısal uygulaması

Answer 1

dom manipülasyon bu tür should direktifleri yapılabilir.

u `$ compile` kullanmak gerekir açısal derleme hizmetini $compile