שאלה (פשוטה לכאורה) באנגולרJS



  • יש לי כמה div-ים שכל אחד מייצג אופציה לבחירה. אפשר לבחור רק באחד מהם.
    אני רוצה לעצב את האופציה הפעילה בצורה שונה מהשאר. איך עושים את זה?

    זה עובד:

    <div id="option1" ng-class="{active: selectedOption==='option1'}">
    ...
    </div>
    <div id="option2" ng-class="{active: selectedOption==='option2'}">
    ...
    </div>
    <div id="option3" ng-class="{active: selectedOption==='option3'}">
    ...
    </div>
    <div id="option4" ng-class="{active: selectedOption==='option4'}">
    ...
    </div>
    

    לכאורה אמור להיות משהו יותר אלגנטי מזה
    אציין שהאני בדווקא לא רוצה להשתמש ב-ng-repeat כי אין תבנית קבועה.
    אני מנסה להגיד לאנגולר:

    ng-class="{active: selectedOption===this.id}"
    

    כאשר this מציין את האלמנט הנוכחי.
    או משהו בסגנון


  • תכנות

    אולי תנסה לעשות את זה עם directive

            app.directive("activeRouter", ['$location', ($location) => {
                return {
                    link: function (scope, element) {
                        if(element[0].id === $location.path()) element[0].classList.add('active');
                    }
    
                };
            }])```


  • @yossiz אמר בשאלה (פשוטה לכאורה) באנגולרJS:

    אציין שהאני בדווקא לא רוצה להשתמש ב-ng-repeat כי אין תבנית קבועה.

    קשה לי להבין, תוכל להניח את דעתי למה ng-repeat לא טוב?
    שים לב שבכל מקרה אתה יכול לשים מערך שרירותי בקוד ממש מקביל לכל מה שעשית בHTML.
    אז שוב השאלה נפתרה.

    בלי ng-repeat אני חושב שחייבים דיירקטיב.



  • @dovid אמר בשאלה (פשוטה לכאורה) באנגולרJS:

    קשה לי להבין, תוכל להניח את דעתי למה ng-repeat לא טוב?

    ב-div של תפו"א אני מכניס תמונה של עגבניות, ב-div של ביצים אני מכניס המלצה (מיושנת) של הרופאים לא לאכול יותר מא' ליום, ב-div של מרגרינה אני מוסיף באנר צהוב על גבי ורוד לגבי סכנות בריאותיות.
    כמובן, זה לשם הדגמה...
    אשמח אם תוכל להדגים לי איך לעשות משהו כזה ב-ng-repeat.


התחבר כדי לפרסם תגובה
 

18
מחובר

2.3k
משתמשים

7.4k
נושאים

87.3k
פוסטים

gardner photograph

סלולר כשר במחירים הנמוכים ביותר עם ובלי ניוד.

כנסו לאתר לקניה מקוונת, או בדקו סניף קרוב לביתכם.

מוצרים עם הנחה

לחצו פה כדי להגיע לרשימת מוצרים עם הנחה בקיאספי.

בהגעה דרך הלינק, ישנה הנחה בשלב התשלום בקופה!

בא תתחבר לדף היומי!