Angular: μ•Œ 수 μ—†λŠ” 속성(예: Aria 속성)에 λ°”μΈλ”©ν•˜λ©΄ 였λ₯˜κ°€ λ°œμƒν•©λ‹ˆλ‹€.

에 λ§Œλ“  2015λ…„ 09μ›” 27일  Β·  3μ½”λ©˜νŠΈ  Β·  좜처: angular/angular

Aria 속성과 같은 μ•Œ 수 μ—†λŠ” 속성에 λ°”μΈλ”©ν•˜λ©΄ 였λ₯˜κ°€ λ°œμƒν•©λ‹ˆλ‹€. 예λ₯Ό λ“€μ–΄:

<a class="cell-anchor " [aria-expanded]="isFirstError(error)" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapse-{{error.id}}" aria-expanded="false">

ν…œν”Œλ¦Ώμ— 이 μ½”λ“œκ°€ ν¬ν•¨λœ ꡬ성 μš”μ†Œκ°€ λ‘œλ“œλ˜λ©΄ λ‹€μŒ μ˜ˆμ™Έκ°€ λ°œμƒν•©λ‹ˆλ‹€.

μ˜ˆμ™Έ: 'ariaExpanded'λŠ” ' ' μš”μ†Œμ˜ μ•Œλ €μ§„ 속성이 μ•„λ‹ˆκ³  ν•΄λ‹Ή 속성과 μΌμΉ˜ν•˜λŠ” μ§€μ‹œλ¬Έμ΄ μ—†κΈ° λ•Œλ¬Έμ— 'ariaExpanded'에 바인딩할 수 μ—†μŠ΅λ‹ˆλ‹€.

aria μ†μ„±μ—λŠ” λŒ€μ‹œκ°€ ν¬ν•¨λ˜λŠ” κ²½μš°κ°€ λ§ŽμœΌλ―€λ‘œ μ‹€μ œλ‘œ μ˜¬λ°”λ₯΄μ§€ μ•Šμ€ ariaExpanded둜 λ³€ν™˜ν•˜κ³  μžˆμŠ΅λ‹ˆλ‹€(λ‚΄κ°€ λͺ¨λ₯΄λŠ” νƒˆμΆœ λ©”μ»€λ‹ˆμ¦˜μ΄ μžˆμ„ 수 μžˆμŠ΅λ‹ˆκΉŒ?'). μ•Œ 수 μ—†λŠ” 것에 λ°”μΈλ”©ν•˜λ©΄ λ™μΌν•œ λ¬Έμ œκ°€ λ°œμƒν•˜λ―€λ‘œ 이것이 κ·Όλ³Έ 원인은 μ•„λ‹™λ‹ˆλ‹€.

μ˜ˆμ™Έ: 'foo'λŠ” ' ' μš”μ†Œμ˜ μ•Œλ €μ§„ 속성이 μ•„λ‹ˆκ³  ν•΄λ‹Ή 속성과 μΌμΉ˜ν•˜λŠ” μ§€μ‹œλ¬Έμ΄ μ—†κΈ° λ•Œλ¬Έμ— 'foo'에 바인딩할 수 μ—†μŠ΅λ‹ˆλ‹€.

ν”ŒλŸ°μ»€κ°€ ν•„μš”ν•œ 경우 μ•Œλ €μ£Όμ‹œλ©΄ ν•˜λ‚˜ λ§Œλ“€μ–΄ λ“œλ¦¬κ² μŠ΅λ‹ˆλ‹€.

κ°€μž₯ μœ μš©ν•œ λŒ“κΈ€

DOM μš”μ†Œμ—λŠ” aria-expanded _property_κ°€ μ—†μŠ΅λ‹ˆλ‹€. μ΄λŸ¬ν•œ 이름을 가진 _attribute_만 μžˆμŠ΅λ‹ˆλ‹€. 속성에 λ°”μΈλ”©ν•˜λ €λ©΄ ν•΄λ‹Ή 이름에 attr. 접두사λ₯Ό λΆ™μ—¬μ•Ό ν•©λ‹ˆλ‹€(예: [attr.aria-expanded]="isFirstError(error)" ).

λ”°λΌμ„œ 였λ₯˜λŠ” μ •ν™•ν•˜κ³  μ‘΄μž¬ν•˜μ§€ μ•ŠλŠ” 속성에 λŒ€ν•œ 바인딩은 영ν–₯을 λ―ΈμΉ˜μ§€ μ•ŠμœΌλ―€λ‘œ μ•Œ 수 μ—†λŠ” 속성에 λŒ€ν•΄ ν™•μ‹€νžˆ throwν•˜λ €κ³  ν•©λ‹ˆλ‹€. 이것은 λŒ€λΆ€λΆ„μ˜ 경우 μ‚¬μš©μž 였λ₯˜μž…λ‹ˆλ‹€.

λͺ¨λ“  3 λŒ“κΈ€

DOM μš”μ†Œμ—λŠ” aria-expanded _property_κ°€ μ—†μŠ΅λ‹ˆλ‹€. μ΄λŸ¬ν•œ 이름을 가진 _attribute_만 μžˆμŠ΅λ‹ˆλ‹€. 속성에 λ°”μΈλ”©ν•˜λ €λ©΄ ν•΄λ‹Ή 이름에 attr. 접두사λ₯Ό λΆ™μ—¬μ•Ό ν•©λ‹ˆλ‹€(예: [attr.aria-expanded]="isFirstError(error)" ).

λ”°λΌμ„œ 였λ₯˜λŠ” μ •ν™•ν•˜κ³  μ‘΄μž¬ν•˜μ§€ μ•ŠλŠ” 속성에 λŒ€ν•œ 바인딩은 영ν–₯을 λ―ΈμΉ˜μ§€ μ•ŠμœΌλ―€λ‘œ μ•Œ 수 μ—†λŠ” 속성에 λŒ€ν•΄ ν™•μ‹€νžˆ throwν•˜λ €κ³  ν•©λ‹ˆλ‹€. 이것은 λŒ€λΆ€λΆ„μ˜ 경우 μ‚¬μš©μž 였λ₯˜μž…λ‹ˆλ‹€.

λ©‹μ§€λ„€μš”. attr. 접두사λ₯Ό λͺ°λžμŠ΅λ‹ˆλ‹€. μ΄λŠ” GA둜 이동할 λ•Œλ§ˆλ‹€ λͺ…ν™•ν•˜κ²Œ λ¬Έμ„œν™”ν•΄μ•Ό ν•©λ‹ˆλ‹€.

κ·ΈλŸ¬λ‚˜ 바인딩이 attr. 접두어λ₯Ό 놓쳀을 λ•Œ μš°λ¦¬κ°€ μ œκ³΅ν•˜λŠ” λ©”μ‹œμ§€λ₯Ό κ°œμ„ ν•  κΈ°νšŒκ°€ μžˆλ‹€κ³  μƒκ°ν•©λ‹ˆλ‹€. λ‹€μŒκ³Ό 같은 것을 인쇄할 수 μžˆλ‹€λ©΄ λ¬Έμ„œλ„ ν•„μš”ν•˜μ§€ μ•Šμ„ κ²ƒμž…λ‹ˆλ‹€.

*_EXCEPTION: ' ' μš”μ†Œμ˜ μ•Œλ €μ§„ 속성이 μ•„λ‹ˆκ³  ν•΄λ‹Ή 속성과 μΌμΉ˜ν•˜λŠ” μ§€μ‹œλ¬Έμ΄ μ—†κΈ° λ•Œλ¬Έμ— 'foo'에 바인딩할 수 μ—†μŠ΅λ‹ˆλ‹€. *_

이 λ¬Έμ œλŠ” 이 λ©”μ‹œμ§€ κ°œμ„ μ„ μΆ”μ ν•˜λŠ” 데 μ‚¬μš©ν•  수 μžˆμŠ΅λ‹ˆλ‹€.

이 λ¬Έμ œλŠ” ν™œλ™μ΄ μ—†μ–΄ μžλ™μœΌλ‘œ μž κ²ΌμŠ΅λ‹ˆλ‹€.
μœ μ‚¬ν•˜κ±°λ‚˜ κ΄€λ ¨λœ λ¬Έμ œκ°€ λ°œμƒν•˜λ©΄ μƒˆ 문제λ₯Ό μ œμΆœν•˜μ‹­μ‹œμ˜€.

μžλ™ λŒ€ν™” 잠금 μ •μ±… 에 λŒ€ν•΄ μžμ„Ένžˆ μ•Œμ•„λ³΄μ„Έμš”.

_이 μž‘μ—…μ€ 봇에 μ˜ν•΄ μžλ™μœΌλ‘œ μˆ˜ν–‰λ˜μ—ˆμŠ΅λ‹ˆλ‹€._

이 νŽ˜μ΄μ§€κ°€ 도움이 λ˜μ—ˆλ‚˜μš”?
0 / 5 - 0 λ“±κΈ‰