2016-12-19 2 views
0

В настоящее время я использую Angular 2 с jQuery, jQuery объединяется в отдельный файл. Этот файл существует из многих областей, . Область действия - это просто функция готовности документа с каждым элементом по конкретным элементам.Выполнение jQuery каждый в Angular 2 при изменении маршрута

При перезагрузке браузера на правильной странице код запускается отлично, потому что он действительно находит элементы на документ готов, однако при навигации с другой страницы код не запускается.

Я пытался работать над проблемой, установив ngAfterViewInit() в компоненте приложения, загрузка сценария там, а не в index.html, как это:

export class AppComponent implements AfterViewInit{ 
    ngAfterViewInit() { 
     $(document).ready(function() { 
      $.getScript("library/js/main.min.js"); 
     }); 
    } 
} 

код снова только исполняющим при перезарядке на том, что конкретную страницу, мне нужно добавить это ngAfterViewInit() на каждый отдельный компонент?

+1

Hm не Rly уверен, как справиться с этим, но вы можете попытаться подписаться на маршрутизатор событий (+ возможно фильтр для события NavigationEnd) и запустить свой код, чем каждый раз, когда изменения маршрута .. –

ответ

0

Решение было прослушивателем событий маршрутизатора, оно будет искать изменения в маршрутах, а затем выполнить код внутри, здесь я перезагрузил js-файл с помощью jQuery.

import { Component, OnInit } from '@angular/core'; 
import { Router, NavigationEnd, ActivatedRoute } from '@angular/router'; 

import 'rxjs/add/operator/filter'; 
import 'rxjs/add/operator/map'; 

declare var $:any; 

export class AppComponent implements OnInit { 
    constructor(
     private router: Router, 
     private activatedRoute: ActivatedRoute 
    ) { } 

    ngOnInit() { 
     this.router.events 
     .filter(event => event instanceof NavigationEnd) 
     .map(() => this.activatedRoute) 
     .subscribe((event) => { 
      $.getScript('library/js/main.min.js'); 
     }); 
    } 
} 
Смежные вопросы