استفاده از جی کوئری در انگولار

بله دقیقا قبول دارم که این یک کار اشتباه هست اما مثلا کد زیر رو چطور میتونم با typescript بنویسم ؟ واقعا نتونستم راه کاری براش پیدا کنم
توی ریکت به نظرم به سادگی با refs میتونیم به المنت ها دسترسی داشته باشیم اما در انگولار واقعا متوجه این نشدم که چطور میتونم این کارها رو انجام بدم

$(".navigation-bar .nav-item > *,#menu > li > a,#room-filter > a").click(function () {
    if ($(this).hasClass("hsb")) {
        if (!$(this).hasClass("open")) {
            $(".sub-menu").removeClass("open")
            $(".hsb").removeClass("open")
            $(this).addClass("open")
            $(this).siblings(".sub-menu").addClass("open")
            $("#wrapper-overlay").addClass("active");
            return false;
        }
        if ($(this).hasClass("open")) {
            $(".sub-menu").removeClass("open")
            $(".hsb").removeClass("open")
            $("#wrapper-overlay").removeClass("active");
        }    
        return false;
    } 
})

حتی یک نمونه با typescript نوشتم اما به نظرم اصلا درست نبود و خطا داشت و ناچارم جی کوئری رو استفاده کنم ...
ممنون میشم بیشتر راهنمایی کنید

من با تایپ اسکریپت که آشنا نیستم ولی شما میتونین همین را به راحتی با جاوا اسکریپت pure پیاده کنین و از نظر سرعتی هم خیلی بهتر جواب میده اینکار

این مورد اصلا به تایپ اسکریپت نیاز نداره همونطور که دوستمون علی هم گفتن اگر شما خود جاوا اسکریپت رو بلد باشید میتونید به سادگی اینکارو انجام بدید .
فکر میکنید جی کوئری جادو میکنه ؟ نه جی کوئری فقط اومده مواردی که خود جاوا اسکریپت برای کار با DOM داره رو کنار هم قرار داده و یمقدار راحت تر کرده کارو وگرنه تمام کارهای که در این قطعه کد دارین میگین رو راحت با جاوا اسکریپت میشه انجام داد