Angular - 5.5-Attribution d'un alias aux propriétés personnalisées

Dans la dernière vidéo, nous avons appris quelque chose de crucial. Nous avons appris comment bind nos propres propriétés avec des parenthèses @Input devant, c'est super important.

Maintenant, vous pouvez même le configurer un peu plus. Parfois, vous ne voulez pas utiliser la même propriété à l'extérieur du composant que celle que vous utilisez à l'intérieur.

Donc, à l'intérieur de ce composant, vous pourriez dire que "element" est exactement le nom de propriété que je veux utiliser car cela a le plus de sens, mais à l'extérieur, peut-être que vous ne voulez pas bind à "element", et donc bind à "srvElement" pour clarifier que c'est le server element quelque chose comme ça.

Bien sûr, cela ne fonctionnerait pas car maintenant vous essaieriez de bind à une propriété, Angular ne sait pas qu'elle peut être lier car il n'y a pas de propriété "server element" dans ce composant avec "@Input" devant.

Vous pouvez assigner un alias, vous pouvez passer un argument à @Input avec le nom de propriété tel que vous le voulez en dehors de ce composant. Donc, "srvElement" pourrait être ajouté ici et maintenant, depuis l'extérieur, donc depuis le composant où vous implémentez ce composant, vous devez maintenant cibler "srvElement" si vous voulez bind à cette propriété. "Element" ne fonctionnera plus, il doit être "srvElement", c'est pourquoi maintenant avec ces deux endroits modifiés dans l'app-composant et dans le server-element-component, nous voyons la même chose qu'avant, mais maintenant en liant via l'alias. Et juste pour être vraiment sûr, pour clarifier cela, vous devez utiliser "srvElement", "element" ne fonctionnera plus.

Donc c'est un petit bonus, une petite alternative, au cas où vous voudriez bind à un autre nom de propriété en dehors du composant, c'est ainsi que vous assignez un alias.