Vorrei scavalcare la pipe "date" e godermi il beneficio dell'accesso globale ovunque, proprio come la pipe integrata, ovvero evitare di dover importare e usare pipe [] array in ogni annotazione di componente. È possibile?È possibile sovrascrivere i tubi Angular 2 integrati in modo che possano essere utilizzati globalmente?
risposta
Sì, è possibile utilizzare PLATFORM_PIPES
per aggiungere una pipa personalizzata e denominare la pipa date
per dirottarla.
@Pipe({
name : 'date' // Hijacks the 'date' pipe
})
class CustomDatePipe {
transform(val, args) {
return /* do something new with the value */;
}
}
@Component({
selector: 'my-app',
template : '{{mydate | date}}',
})
export class App {
mydate = Date.now();
}
// Provides the CustomDatePipe globally
bootstrap(App, [provide(PLATFORM_PIPES, {useValue: [CustomDatePipe], multi: true})]);
In questo modo non sarà necessario aggiungere specificare ogni volta in pipes
proprietà a componenti.
Ecco un plnkr con un esempio di lavoro.
Sì, utilizzare PLATFORM_PIPES in modo seguente
https://angular.io/docs/ts/latest/api/core/index/PLATFORM_PIPES-let.html
rispostaimport {PLATFORM_PIPES} from '@angular/core';
import {OtherPipe} from './myPipe';
@Component({
selector: 'my-component',
template: `
{{123 | other-pipe}}
`
})
export class MyComponent {
...
}
bootstrap(MyComponent, [{provide: PLATFORM_PIPES, useValue: [OtherPipe], multi:true}]);
Eric Martinez' funziona bene! Tieni presente che PLATFORM_PIPES è obsoleto in Angular4. I tubi della piattaforma in Angular4 sono configurati tramite app.modules:
/**
* `AppModule`
*/
@NgModule({
...
providers: [
...
CustomDatePipe
]
})
E per i test (per rispondere alla domanda di Vilmantas Baranauskas): puoi scrivere un test per il tubo stesso e nel tuo test invocare esplicitamente la trasformazione, ad es. new CustomDatePipe(). transform (input) –
- 1. utilizzando jQuery globalmente nell'applicazione Angular 2
- 2. Visualizza errori HTTP globalmente con Angular 2
- 3. Che cos'è @angular in Angular 2?
- 4. È possibile aggiungere una classe dinamica all'host in Angular 2?
- 5. È possibile utilizzare pipe nel codice in Angular 2?
- 6. Perché Integer e int possono essere utilizzati in modo intercambiabile?
- 7. Angular 2 - Qual è il modo migliore per memorizzare variabili globali come il token di autenticazione in modo che tutte le classi possano accedervi?
- 8. È possibile nascondere/proteggere i dati utilizzati in webGL?
- 9. Che cos'è l'evento `change` in Angular 2
- 10. È possibile impostare na.rm su TRUE globalmente?
- 11. Dove è angular2 polyfills ora che Angular 2 non beta è impacchettato come @angular?
- 12. In che modo i controlli WPF integrati gestiscono i gestori di eventi su un evento collegato?
- 13. Come raggruppare i dati in Angular 2?
- 14. Come si costruisce un'app RCP Eclipse in modo che le sue funzionalità possano essere aggiornate automaticamente?
- 15. È possibile modificare dinamicamente i fogli di stile globali in Angular 2?
- 16. Servizio WCF: come proteggere in modo che solo i miei clienti possano usarlo?
- 17. Dichiarare le classi statiche in modo che possano essere memorizzate all'interno dell'elenco
- 18. È possibile sovrascrivere un costruttore in C#?
- 19. Tubo dinamico in Angular 2
- 20. Come esportare un'attività in modo che altre app possano chiamarla?
- 21. I servizi di Windows devono garantire che i comandi possano essere elaborati su thread diversi?
- 22. Nested Observable in Angular 2
- 23. È possibile sovrascrivere i metodi di categoria? IOS
- 24. Stili condivisi tra i componenti in un'app Angular 2
- 25. Angular 2 Multiple validators
- 26. Modo corretto per importare D3.js in un'applicazione Angular 2
- 27. Elimina pacchetti integrati in Emacs
- 28. File SVG in Raphael, possono essere utilizzati?
- 29. Configurare TFS2010 in modo che gli utenti possano creare/aggiornare i bug ma non modificare nient'altro
- 30. Modifica di un metodo in modo che gli argomenti possano essere di qualsiasi tipo che implementa Comparabile
Sapete cosa è necessario fare in modo che i tubi siano anche disponibili globalmente nei test unitari? –