2015-01-02 4 views
0

Я использую AngularJs и Pjax на странице.AngularJs перестает работать после pjax

После того, как часть моей страницы перезагружена Pjax, Angularjs перестает работать там.

Простой {{2 + 2}} работает везде, кроме части, перезаряженной pjax.

Я нашел, что проблема заключается в использовании компиляции $.

Я пробовал разные фрагменты кода, но ни один из них не работал для меня.

Ни это один

angular.element(document).ready(function() { 
    angular.bootstrap(document); 
    }); 

ни это

// outside of angular... 
    var ngRefresh = function() { 
    var scope = angular.element("body").scope(); 
    var compile = angular.element("body").injector().get('$compile'); 

    compile($("body").contents())(scope); 
    scope.$apply(); 
} 

// PJAX 
$('#page').on('pjax:success', function(e){ 
    ngRefresh(); 
}); 

фрагменты кода работал для меня. Кто-нибудь знает рабочее решение?

UPD: После консультации PSL, чтобы изменить $ ("тело") до $ (document.body) код начал работать. Но теперь все инициализируется с нуля, и я теряю свои данные (выбранное изображение в моем примере) после каждого вызова pjax. Как я могу избежать этого?

Это мой JS файл:

app = angular.module("BlogImageApp", []); 

app.controller("BlogImageController", function($http, $scope){ 

$scope.selectedImageId = null; 
$scope.selectedImageUrl = ""; 

$scope.selectImage = function(image_id) { 
    $scope.selectedImageId = image_id; 
    var params = 'id='+image_id; 
    $http.get('/blog/image/get-url-by-id?'+params).success(function(data){ 
     $scope.selectedImageUrl = data; 
    }); 

} 
}); 

// registers the BlogImageApp in the view 

angular.bootstrap(document, ['BlogImageApp']); 
+1

Любые ошибки в консоли? – tymeJV

+0

__ ^^ __ И у вас нет ng-приложения в вашем представлении? – PSL

+0

@tymeJV Да, у меня есть некоторая ошибка, но это не очень информативно, как и для меня. Ошибка: [jqLite: nosel] _http: //errors.angularjs.org/1.2.27/jqLite/nosel, а затем указатель на место в код Полный текст: Ошибка: [jqLite: nosel] HTTP : //errors.angularjs.org/1.2.27/jqLite/nosel \t ... gify (arguments [c]): arguments [c]); return Error (a)}} function Sa (b) { если (нуль == Ь || Ja (... \t angular.min.js (строка 6, столбец 449) –

ответ

0

Это может быть состояние гонки между загрузкой DIV и выполнения кода, содержащегося в нем. Здесь немного jquery, которое заставляет angularjs загружаться после нагрузки div pjax.

https://masonoise.wordpress.com/2013/05/01/pjax-and-angularjs/

Смежные вопросы