حل NG8002 لربط نموذج مستقل

افهم الأسباب المحتملة

• تعلن المستقلة اعتماديات القالب في imports؛ ولا يسجلها استيراد TypeScript وحده. توفر ReactiveFormsModule توجيهات التفاعلية ويستخدم NgModel القالبي استيرادًا ونموذجًا آخر. ليس المزج على الإدخال إصلاحًا مناسبًا.
• قد يكون السبب تهجئة أو مضيف اختبار باستيرادات مختلفة. يخفي المخطط الواسع الدليل دون إرفاق السلوك. أصلح عند مالك القالب؛ فلا يستورد مزود جذري كل توجيه عامة.

تحديد نطاق القالب الفعلي

ابحث عن مالك الإدخال لا الصفحة التي تعرضه فقط. يحتاج المقتطف name وReactiveFormsModule في imports لمالكه، ولا يستقل بالتشغيل. لا يملك input خاصية أصلية formControl؛ فلا بد من التوجيه. أكد الصياغة ونوع النموذج قبل البيانات الوصفية.

<input [formControl]="name">

استيراد ReactiveFormsModule عند المالك

يستورد التصحيح التوجيهات وينشئ تحكمًا غير قابل للفراغ ويربط التسمية بالمعرّف. هو تعريف كامل لكنه يحتاج إقلاعًا وDOM، فيظل تابعًا. لا يعوض استيراد الوالد NameEditor اعتمادية نموذجها. صغّر الإصلاح وأزل إخفاء المخطط المضاف لهذا الخطأ.

import { Component } from "@angular/core";
import { FormControl, ReactiveFormsModule } from "@angular/forms";
@Component({
  selector: "app-name-editor", standalone: true, imports: [ReactiveFormsModule],
  template: `<label for="name">Name</label><input id="name" [formControl]="name">`
})
export class NameEditor { readonly name = new FormControl("Mira", { nonNullable: true }); }

فحص النموذج دون تضخيم النتيجة

يفحص البرنامج المحلي نموذج الحزمة الفعلي وتغير القيمة لا عرض الإصلاح. قد ينجح النموذج ويبقى التوجيه مفقودًا بالتطبيق. أضف تجربة تدخل النص عبر التسمية وتفحص النموذج عند توافر العداء.

import "@angular/compiler";
import { FormControl } from "@angular/forms";
const name = new FormControl("Mira", { nonNullable: true });
name.setValue("Lina");
console.log(name.value);

Lina

امنع تكرار المشكلة

• أبقِ الاعتماديات عند مالكها وميّز المزود والاستيراد واختبر المستهلك بمضيف. عامل الربط المجهول دليلًا بدل إخفائه تلقائيًا.