2012-12-04 17 views
9

Jedna część tej aplikacji pobiera kod HTML z serwera, który musi być wyświetlany jako aktywny HTML. Można to łatwo zrobić za pomocą dyrektywy ng-bind-html-unsafe="expression" (przynajmniej w wersji Angular 1.0.2).Wstaw HTML ze skryptami, które powinny działać

Jednak kod HTML ma również kod JavaScript, który powinien zostać uruchomiony, ponieważ definiuje funkcje używane w kodzie HTML i nie wydaje się, aby to miało miejsce w przypadku dyrektywy.

Czy jest jakiś sposób na zrobienie tego w stylu Angula? Czy muszę zbadać techniki ładowania skryptów pozapasmowych?

(Proszę, nie dyskutujmy, czy powinienem zaufać serwerowi wystarczającemu do uruchomienia skryptu java, który wysyła do mnie .. Ufam serwerowi, jestem świadomy ryzyka i jest to bardzo wyspecjalizowana sytuacja.)

+0

Czy skrypt w załadowanym html może być kontrolerem Angular? Jeśli nie, to myślę, że nie jest to możliwe, ponieważ Angular (to w rzeczywistości jquery, którego używają do załadowania htmls) ignoruje tagi skryptów. Odbyła się dyskusja na ten temat w grupach google. – matys84pl

+0

Nie, nie kontroluję formatu HTML. Jest to zrzut danych ColdFusion lub Railo, generowany przez silnik CFML, z js w celu rozszerzenia i zwinięcia jego części. Zwykły stary autonomiczny HTML z osadzonym js. Nie używam pełnego jQuery (do tej pory), tylko wbudowanego jQqLite firmy Angular, ale zasady są prawdopodobnie takie same. Jak na ironię, usuwa funkcje, ale pozostawia onClick, które je wywołują, więc pojawiają się błędy po kliknięciu. – enigment

Odpowiedz

7

trzeba jQuery (załadować go przed kątowych):

„przyjrzeliśmy się wsparcie znaczników skryptów w jqlite, ale to, co należy zrobić, aby uzyskać wsparcie w ramach cross-browser wymaga dużo czarnej magii z tego powodu. zdecydowałem, że na razie będziemy tylko zalecać użytkownikom używanie jquery wraz z kanciastym w tym konkretnym przypadku "- https://groups.google.com/d/msg/angular/H4haaMePJU0/5seG803by5kJ

Zobacz także AngularJS: How to make angular load script inside ng-include?

+0

Zaznaczam to jako prawidłowe, z zastrzeżeniem, że istnieją rozwiązania o niższej wadze, które mogą mieć zastosowanie w ograniczonych przypadkach. [Igor zwraca uwagę] (https://github.com/angular/angular.js/issues/369), że aby być całkowicie poprawnym, Angular musiałby przeanalizować i dołączyć kod HTML przed każdym tagiem skryptu, stworzyć skrypt, a następnie kontynuować podobnie z resztą kodu HTML. W niektórych przypadkach wystarczy wstawić cały kod HTML, a następnie zlokalizować i uruchomić wszystkie osadzone w nim znaczniki skryptów, co może być prostsze. – enigment

6

Mogę zaproponować mój wariant. Najpierw należy utworzyć dyrektywę:

app.directive('html', [ function() { 
    return { 
    restrict: 'A', 
    link: function (scope, element, attrs) { 
     element.html(attrs.html); 
    } 
    } 
}]); 

Następnie można użyć jej wewnątrz znacznika.

<div html="{{code}}"></div> 
+2

używając rozwiązania opartego na dyrektywach podobnego do tego, zadziałało dla mnie – yash

Powiązane problemy