Quelle est la différence entre la production et le mode de développement dans Angular2?
Pour une raison quelconque, je dois exécuter mon application en mode de production. Quelle est la différence entre ces modes?
En mode de développement, la détection de modification effectue une deuxième exécution immédiatement après la première exécution et génère une erreur si une valeur liée a changé entre la première et la deuxième exécution. Cela permet de localiser les bogues pour lesquels la vérification des valeurs a des effets secondaires ou que les champs ou les fonctions ne renvoient pas la même valeur lors d'appels ultérieurs, ce qui nuit à la détection des modifications par Angular.
En mode développement, lors de la deuxième exécution de la détection des modifications, Angular effectue également certaines comparaisons d'objets approfondies, ce qui n'est pas le cas en production pour détecter les modifications de modèle non autorisées.
Mise à jour:
En mode développement, un indice est également imprimé sur la console lorsque le service d'assainisseur HTML supprime les valeurs des liaisons [innerHTML]="..." ou [ngStyle]="...". Voir aussi: Dans RC.1, certains styles ne peuvent pas être ajoutés à l'aide de la syntaxe de liaison
Les documents pour ApplicationRef.tick () déclarent:
En mode de développement,
tick()effectue également un deuxième cycle de détection de modification (TTL = 2) pour garantir qu'aucune autre modification n'est détectée. Si des modifications supplémentaires sont détectées au cours de ce deuxième cycle, les liaisons dans l'application ont des effets secondaires qui ne peuvent pas être résolus en une seule étape de détection de modification. Dans ce cas, Angular lève une erreur, car une Angular ne peut avoir qu'un seul passage de détection de modification au cours duquel toute la détection de modification doit être terminée.
La raison pour laquelle nous ne pouvons pas avoir de modifications supplémentaires, c'est parce qu'en mode de production, la détection des modifications ne s'exécute qu'une seule fois, ce qui signifie que chaque composant de l'arborescence des composants est examiné une fois (TTL = 1) ... depuis le haut, en profondeur d'abord. ordre. Donc, si, par exemple, une modification de la propriété d'entrée d'un composant enfant entraîne une modification d'une autre propriété que le composant parent a liée dans une vue/un modèle, la vue du composant parent ne sera pas mise à jour (car la détection des modifications ne revisitera pas le composant parent en mode de production ... en raison de la traversée de l'arborescence "une passe"). Il ne sera mis à jour que la prochaine fois qu'un événement se produira et que la détection de changement sera exécutée à nouveau - mais c'est trop tard!
Voici un Plunker qui ne respecte pas la règle - un composant enfant utilise une méthode set sur une propriété d'entrée qui modifie une autre propriété d'entrée. Oui, c'est un exemple artificiel, mais il est plus facile à comprendre que le suivant:
Un autre scénario dans lequel vous pourriez rencontrer ce problème concerne les canaux avec état. Départ cette réponse si c'est votre problème.
Vous devriez décrire votre problème (dans une autre SO question)). Il devrait y avoir un moyen de le résoudre.