كيفية الوصول إلى عنصر DOM في قالب مكون Angular؟

مرحبًا! أنا مبتدئ في Angular و TypeScript، وقد واجهت مشكلة في الوصول إلى عنصر DOM داخل المكون. لدي مكون بسيط يعرض زرًا وفقرة. أريد عند النقر على الزر تغيير النص في الفقرة وإضافة class CSS إليها. في JavaScript العادي كنت سأستخدم `document.getElementById('myParagraph')`، لكن في Angular يبدو أن هذا لا يعمل بشكل صحيح. إليك الكود الحالي الخاص بي: ```typescript // my-component.ts import { Component } from '@angular/core'; @Component({ selector: 'app-my', template: `

نص ابتدائي

تغيير النص `, styleUrls: ['./my-component.css'] }) export class MyComponent { changeText() { // أحاول الحصول على العنصر بواسطة ID const paragraph = document.getElementById('myParagraph'); if (paragraph) { paragraph.innerText = 'نص جديد'; paragraph.classList.add('highlight'); } } } ``` المشكلة هي أن