Cet article est un article miroir de traduction automatique, veuillez cliquer ici pour accéder à l’article original.

Architect_Programmer_Code Réseau agricole»Architecte › Conception front-end & web › Cadre frontal › La série angulaire 11 (XV) acquiert la hauteur des composantes et ajuste dynamiquement la hauteur ...
Vue: 9574|Répondre: 1

[Angulaire] La série Angular 11 (XV) acquiert la hauteur des composants et ajuste dynamiquement la hauteur

[Copié le lien]
Publié sur 23/08/2020 18:05:22 | | | |
Composants dynamiquement chargés de la série Angular 9 (1)
https://www.itsvse.com/thread-9238-1-1.html

Paramètres de transmission dynamique des composants de la série angulaire 9 (2)
https://www.itsvse.com/thread-9245-1-1.html

La série Angular 9 (3) s’inscrit aux événements dynamiques à composants
https://www.itsvse.com/thread-9246-1-1.html

Canalisations personnalisées Angular 9 Series (IV)
https://www.itsvse.com/thread-9248-1-1.html

Angular 9 Series (V) formate le format de la monnaie de la quantité
https://www.itsvse.com/thread-9249-1-1.html

La série angulaire 9 (VI) appelle des variables et méthodes JS natives
https://www.itsvse.com/thread-9254-1-1.html

Lunette CSS de type CSS de la série Angular 9 (VII)
https://www.itsvse.com/thread-9264-1-1.html

La série angulaire 9 (VIII) met à jour la valeur d’un composant enfant en déclenchant un événement via un ensemble
https://www.itsvse.com/thread-9267-1-1.html

Série Angular 9 (neuf) #id sélectionneur appliqué sur la page
https://www.itsvse.com/thread-9278-1-1.html

La série Angular 9 (10) intègre les panneaux de débogage des développeurs vconsole et eruda
https://www.itsvse.com/thread-9286-1-1.html

Série Angular 9 (XI) : 5 façons de définir les styles
https://www.itsvse.com/thread-9305-1-1.html

La série Angular 9 (XII) génère des jetons dynamiques basés sur des OTP
https://www.itsvse.com/thread-9325-1-1.html

La série Angular 10 (treize) introduit les graphiques echarts Baidu
https://www.itsvse.com/thread-9347-1-1.html

Environnement de production Angular 11 série (XIV) pour le débogage
https://www.itsvse.com/thread-9348-1-1.html
Tout d’abord, les codes de hauteur et largeur visibles dynamiques du navigateur sont les suivants :

NousLe div de fond bleu royal change avec la variation de hauteur dans tout le navigateur, la hauteur est un cinquième de la hauteur visible du navigateur, et la console affiche les valeurs ajustées de largeur et de hauteur de la fenêtre actuelle, comme montré dans la figure ci-dessous :



Le code est le suivant :

Code HTML :



Code TS :

Déterminez la hauteur du composant

Le code html du composant app-test1 est le suivant :



Code HTML :

Code TS :

Pour Angular 8 ou une version ultérieure, vous devez fournir deux paramètres dans le ViewChild


Sinon, l’erreur sera la suivante :

Type d’ERREUR : Impossible de lire la propriété « clientHeight » de indéfini
Nous obtenons directement la hauteur du composant test1, elle retournera 0, il faut envelopper une couche de div depuis l’extérieur pour obtenir la hauteur normale, comme montré dans la figure ci-dessous :



(Fin)




Précédent:[Tourne] pour obtenir la position du curseur dans le HTML
Prochain:Démo d’exportation de lecture NPOI

Articles connexes
 Propriétaire| Publié sur 23/08/2020 18:06:05 |
Ou essayez d’utiliser :https://www.npmjs.com/package/angular-resize-event
Démenti:
Tous les logiciels, supports de programmation ou articles publiés par Code Farmer Network sont uniquement destinés à l’apprentissage et à la recherche ; Le contenu ci-dessus ne doit pas être utilisé à des fins commerciales ou illégales, sinon les utilisateurs assumeront toutes les conséquences. Les informations sur ce site proviennent d’Internet, et les litiges de droits d’auteur n’ont rien à voir avec ce site. Vous devez supprimer complètement le contenu ci-dessus de votre ordinateur dans les 24 heures suivant le téléchargement. Si vous aimez le programme, merci de soutenir un logiciel authentique, d’acheter l’immatriculation et d’obtenir de meilleurs services authentiques. En cas d’infraction, veuillez nous contacter par e-mail.
Mail To:help@itsvse.com