2016-05-06 41 views
8

Qual è il modo corretto di manipolare il DOM in Angular 2 RC?Accesso a DOM in Angular 2 RC

Per esempio, sto costruendo un servizio a scopo di debug per scambiare i riferimenti di file .css nel documento.

Prima angolare 2 RC, è stato possibile utilizzare BrowserDomAdapter da manipolazioni DOM, in questo modo:

import { BrowserDomAdapter } from 'angular2/platform/browser'; 

... 
constructor(private domAdapter: BrowserDomAdapter) { 
} 
... 

const document = this.domAdapter.defaultDoc(); 

Questo è stato ispirato dal Title di servizio (ora in @angular/platform-browser). Sembra che il servizio Title lo usi ancora internamente, ma non è più esportato per l'uso al di fuori di Angular. Cioè

import { BrowserDomAdapter } from "@angular/platform-browser"; 

Risultati in:

Module '".../@angular/platform-browser/index"' has no exported member 'BrowserDomAdapter' 
+1

Sono abbastanza sicuro che questo non viene esportato e non c'è alternativa. Creerei un bug report per farlo esportare di nuovo. È stato citato alcune volte nei commenti che non dovrebbe essere usato da sviluppatori esterni, ma non ho mai visto una spiegazione su quale altro dovrebbe essere usato. –

+1

Grazie, @ GünterZöchbauer. Proverò GitHub. E grazie per la risposta, sei una bestia Angular2. –

risposta

5
import {BrowserDomAdapter} from '@angular/platform-browser/src/browser/browser_adapter'; 

UPDATE: (commento)

un issue on GitHub spiega che la rimozione era davvero accidenta l, quindi spero che tornerà in rc2. - @ Paolo

+2

Questo può essere solo una soluzione. Non dovremmo importare da 'src/...' perché è considerato un'implementazione privata. –

+1

Esattamente. solo una soluzione. Forse hanno dimenticato di esportarlo o per qualche ragione semplicemente no. –

+3

un problema su GitHub spiega che la rimozione è stata davvero accidentale, quindi speriamo che tornerà in rc2. https://github.com/angular/angular/issues/8509#issuecomment-217483301 – paul

3

Per persone come me, in attesa per l'interazione con il DOM in angular 2.4:

import { Component, Inject } from '@angular/core'; 
import { DOCUMENT } from '@angular/platform-browser'; 

@Component({}) 
export class MyClass { 

    constructor (@Inject(DOCUMENT) private document) { } 

    doSomething() { 
     this.document.someMethodOfDocument(); 
    } 
} 

Si consiglia di non utilizzare alcun adattatore. Questo è il dettaglio dell'implementazione e non dovrebbe essere usato. Invece @Inject(DOCUMENT) nel componente e usarlo.

Ulteriori approfondimenti: https://github.com/angular/angular/issues/8509

+0

Questo sembra un copia/incolla del commento di Falx: https://github.com/angular/angular/issues/8509#issuecomment-224703913 –