'এনজিমোডেল' এর সাথে আবদ্ধ হতে পারে না কারণ এটি 'ইনপুট' এর পরিচিত সম্পত্তি নয়


1373

উপাদানটি প্রদর্শিত না হলেও, আমার কৌনিক অ্যাপ্লিকেশন চালু করার সময় আমি নিম্নলিখিত ত্রুটিটি পেয়েছি।

<input>আমার অ্যাপটি যাতে কাজ করে সে জন্য আমাকে মন্তব্য করতে হবে ।

zone.js:461 Unhandled Promise rejection: Template parse errors:
Can't bind to 'ngModel' since it isn't a known property of 'input'. ("
   <div>
      <label>Created:</label>
      <input  type="text" [ERROR ->][(ngModel)]="test" placeholder="foo" />
   </div>
</div>"): InterventionDetails@4:28 ; Zone: <root> ; Task: Promise.then ; Value: 

আমি হিরো প্লাঙ্কারের দিকে তাকিয়ে আছি, তবে আমি আমার কোড থেকে কোনও পার্থক্য দেখছি না।

উপাদান ফাইলটি এখানে:

import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
import { Intervention } from '../../model/intervention';

@Component({
   selector: 'intervention-details',
   templateUrl: 'app/intervention/details/intervention.details.html',
   styleUrls: ['app/intervention/details/intervention.details.css']
})

export class InterventionDetails
{
   @Input() intervention: Intervention;

   public test : string = "toto";
}

11
হিরো চোর কি?
আয়রন এসেস

3
গতকাল তারা আরসি 5 এ আপডেট হওয়ার পরেও আমার একই সমস্যা হচ্ছে (আকর্ষণীয়ভাবে এটি আমার সহকর্মীর পক্ষে কাজ করে ..) আমি মনে করি @ গ্রেনিয়িয়ার তাদের টিউটোরিয়ালগুলি সম্পর্কে কথা বলছেন - কৌণিক.ইও
ডকস

4
@ ড্যানিয়েলহিলকক, হিরোস প্লঙ্কার ট্যুর
রাজকোক

2
হ্যাঁ আমি নায়কদের ট্যুরের টিউটোরিয়াল উল্লেখ করেছি কারণ এটি এনজি মডেল ব্যবহার করে।
অ্যান্টনি ব্রেনেলিয়ার

5
আমি কেবল কৌনিকটি ঘুরে দেখছি এবং নায়কদের ট্যুর টিউটোরিয়াল করার সময় এই ত্রুটিটি দেখেছি। নিশ্চিতভাবেই, তারা এখন একেবারে পরের লাইনে কল করে এবং কীভাবে / কেন এটি সংশোধন করবে তা আপনাকে জানায়।
ম্যাট পেনার

উত্তর:


1917

হ্যাঁ এটি তাই, অ্যাপ্লিকেশন.মডিউল.টসে, আমি সবেমাত্র যুক্ত করেছি:

import { FormsModule } from '@angular/forms';

[...]

@NgModule({
  imports: [
    [...]
    FormsModule
  ],
  [...]
})

14
আসলে, আমি গ্যাব্রিয়েলের এই উত্তরটি পছন্দ করি (যা কেবল একটি লিঙ্ক) link এখানে, সঠিক কোড উপস্থাপন করা হয়। বিরক্তিকরভাবে, জন প্যাপসের "অ্যাঙ্গুলারেশন অ্যাঙ্গুলার 2 এর পরিচিতি" এর পরে বহুবর্ষে আমি কেবল এই সমস্যার মুখোমুখি হয়েছি এবং এই সমস্যাটিরও উল্লেখ করা হয়নি। তাদের জন্য, দ্বিমুখী বাইন্ডিং সবেমাত্র কাজ করেছে।
মাইক গ্লেডহিল

20
এটি কাজ করেছে, তবে আমি আমার সাব-মডিউলটিতে এটি আমদানি করার পরেই। এটি প্রাথমিকভাবে সম্পূর্ণ পরিষ্কার নয় যে এটি উপ-মডিউলগুলির দ্বারা উত্তরাধিকার সূত্রে প্রাপ্ত হয় না।
adam0101

3
আমার ক্ষেত্রে, আমার ধনুর্বন্ধনী ব্যবহার ভুল ছিল। আমি সঠিকটির [{ngModel}]পরিবর্তে ব্যবহার করছিলাম :[(ngModel)]
ইমতিয়াজ

29
যারা জুঁইয়ের সাথে একই রকম ব্যর্থতার কারণে এটি খুঁজে পান তাদের জন্য আপনাকেও এই আমদানিগুলি component.spec.tsফাইলে যুক্ত করতে হবে ।
দ্য মায়ার

3
: এবং যেখানে (জুঁই ত্রুটি সংক্রান্ত) এটা করা জন্য stackoverflow.com/questions/39584534/...
bagsmode

533

ফর্ম ইনপুটগুলির জন্য দ্বিমুখী ডেটা বাঁধাই ব্যবহার করতে সক্ষম হতে আপনাকে FormsModuleআপনার Angularমডিউলটিতে প্যাকেজটি আমদানি করতে হবে । আরো তথ্যের জন্য দেখুন Angular 2কর্মকর্তা টিউটোরিয়াল এখানে এবং জন্য সরকারী ডকুমেন্টেশন ফরম


9
আমাকে স্বীকার করতে হবে যে আমি সোমবার অ্যাংুলার দিয়ে শুরু করেছি (তাই 4 দিন আগে) এবং তাদের টিউটোরিয়ালগুলি করছিলাম তাই আমি নিশ্চিত যে আমি কিছু ভুল করেছি তবে আমার জন্য ফর্মমোডুল আমদানি কার্যকর হয়নি। তারপরে আমি নির্দেশগুলিতে import { FORM_DIRECTIVES } from '@angular/forms';যুক্ত হয়ে যুক্ত করেছিলাম FORM_DIRECTIVESএবং হ্যাঁ আমার বাঁধাই আবার কাজ করছে (স্পষ্টতই এটি rc5 প্রকাশের আগে কাজ করছিল)
পেটলহেভ

2
যা এই সঙ্গে সম্পর্কযুক্ত হতে বলে মনে হয় stackoverflow.com/questions/31623879/...
PetLahev

1
টিউটোরিয়ালটি নিয়ে আপনার পেটলেহেভের সমস্যাটি হ'ল August ই আগস্ট, আপনি যখন শুরু করেছিলেন, টিউটোরিয়ালগুলি রিলিজ প্রার্থী চলছিল 8th ই আগস্ট, তারা রিলিজ প্রার্থী ৫-এ রয়েছে, যার আলাদা বাক্য গঠন রয়েছে
এজে জেন ১

5
FORM_DIRECTIVES
টুলকিট

6
এটির কোনও মূল্য নেই যে, আপনি যদি একটি শ্যারডমডুল ব্যবহার করছেন তবে আপনার পাশাপাশি সেখানে ফর্মস মডুলুল আমদানি করতে হতে পারে।
পার্থক্য

241

ব্যবহার করার জন্য [(ngModel)]কৌণিক 2 , 4 & 5+ , আপনি আমদানি প্রয়োজন FormsModule কৌণিক ফর্ম থেকে ...

এছাড়াও এতে ফরম অধীনে এই পথ রয়েছে কৌণিক রেপো মধ্যে GitHub :

কৌণিক / প্যাকেজ / ফর্ম / এসসিআর / ডিরেক্টরি / এনজি_মডেল.টি

সম্ভবত এই জন্য একটি খুব আনন্দ নয় AngularJs ডেভেলপারদের হিসাবে আপনি ব্যবহার করতে পারে NG-মডেল আগে যেকোনো সময় সর্বত্র, কিন্তু যাই হোক না কেন আপনি চান ব্যবহারের পৃথক মডিউল কৌণিক চেষ্টা হিসাবে আপনি সময় ব্যবহার করতে চান, ngModel হয় FormsModule এখন ।

এছাড়াও আপনি যদি রিঅ্যাকটিভফর্মস মোডুল ব্যবহার করছেন তবে এটিও আমদানি করা দরকার।

সুতরাং সহজেই app.module.ts সন্ধান করুন এবং নিশ্চিত হয়ে নিন যে আপনি FormsModuleআমদানি করেছেন ...

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';  //<<<< import it here
import { AppComponent } from './app.component';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule, FormsModule //<<<< and here
  ],
  providers: [],
  bootstrap: [AppComponent]
})

export class AppModule { }

এছাড়াও এটি ফর্মস মডুলেলে অ্যাংুলার 4 ngModelএর জন্য বর্তমান সূচনা মন্তব্যগুলি :

/**
 * `ngModel` forces an additional change detection run when its inputs change:
 * E.g.:
 * ```
 * <div>{{myModel.valid}}</div>
 * <input [(ngModel)]="myValue" #myModel="ngModel">
 * ```
 * I.e. `ngModel` can export itself on the element and then be used in the template.
 * Normally, this would result in expressions before the `input` that use the exported directive
 * to have and old value as they have been
 * dirty checked before. As this is a very common case for `ngModel`, we added this second change
 * detection run.
 *
 * Notes:
 * - this is just one extra run no matter how many `ngModel` have been changed.
 * - this is a general problem when using `exportAs` for directives!
 */

আপনি যদি নিজের ইনপুটটি কোনও ফর্মের মতো ব্যবহার করতে চান না, আপনি এটির সাহায্যে এটি ব্যবহার করতে পারেন ngModelOptionsএবং একককে সত্য করে তুলতে পারেন ...

[ngModelOptions]="{standalone: true}"

আরও তথ্যের জন্য, এখানে কৌণিক বিভাগে ng_model দেখুন


95

আপনার ফর্মমডুল আমদানি করতে হবে

App.module.ts খুলুন

এবং লাইন যুক্ত করুন

import { FormsModule } from '@angular/forms';

এবং

@NgModule({
imports: [
   FormsModule
],
})

54

এটি নিক্ষেপ কারওর পক্ষে সহায়তা করতে পারে।

ধরে নিই যে আপনি একটি নতুন এনজিএমডিউল তৈরি করেছেন, AuthModuleআপনার আথের প্রয়োজনীয়তাগুলি পরিচালনা করার জন্য উত্সর্গীকৃত বলুন , FormsModuleসেই আথমোডুলেও আমদানি করতে ভুলবেন না

আপনি যদি FormsModuleকেবল তখনই ব্যবহার করছেন AuthModuleতবে আপনাকে FormModuleডিফল্টরূপে আমদানি করতে হবে নাAppModule

সুতরাং এর মধ্যে কিছু AuthModule:

import { NgModule }      from '@angular/core';
import { FormsModule } from '@angular/forms';

import { authRouting } from './auth.routing';
import { LoginComponent, SignupComponent } from './auth.component';

@NgModule({
  imports:      [ 
    authRouting,
    FormsModule
   ],
  declarations: [ 
    SignupComponent,
    LoginComponent
  ]
})
export class AuthModule { }

তারপরে AppModuleআপনি FormsModuleঅন্য কোথাও ব্যবহার না করে থাকলে আমদানি করতে ভুলে যান ।


আমার সাব-মডিউলটিতে এটি দরকার ছিল যেখানে আমি ফর্ম বৈশিষ্ট্যগুলি ব্যবহার করছি। উচ্চতর স্তরক্রম পর্যাপ্ত ছিল না।
জেরেফেথ

45

সাধারণ উত্সাহ : অ্যাপ্লিকেশন

উদাহরণ 1

import {FormsModule} from "@angular/forms";  
// add in imports 

imports: [
 BrowserModule,
 FormsModule
 ],

উদাহরণ 2

আপনি যদি [(ngModel)] ব্যবহার করতে চান তবে আপনাকে অ্যাপ.মডিউল.টসে ফর্মস মডেলটি আমদানি করতে হবে

import { FormsModule  } from "@angular/forms";     
@NgModule({
  declarations: [
    AppComponent, videoComponent, tagDirective, 
  ],
  imports: [
    BrowserModule,  FormsModule

  ],
  providers: [ApiServices],
  bootstrap: [AppComponent]
})
export class AppModule { }

27
দুটি উদাহরণের মধ্যে পার্থক্যটি ঠিক কোথায়?
ফিলিপ মেসনার

আমার ক্ষেত্রে, আমার কম্পোনেন্ট.মডিউল.টসগুলিতে ফর্মস মডেলটি আমদানি করতে হয়েছিল
আইএসএফও

40

আপনি যে মডিউলগুলিতে [[ngModel) ব্যবহার করতে চান সেগুলিতে ফর্মস মডেলটি আমদানি করুন]

এখানে চিত্র বর্ণনা লিখুন


39

এই ত্রুটি থেকে মুক্তি পেতে আপনার দুটি পদক্ষেপ অনুসরণ করতে হবে

  1. আপনার অ্যাপ্লিকেশন মডিউলে ফর্মমডুল আমদানি করুন
  2. @NgModule ডেকরেটারে আমদানির মান হিসাবে এটি পাস করুন

মূলত app.module.ts নীচের মত দেখতে হবে:

    import { NgModule }      from '@angular/core';
    import { BrowserModule } from '@angular/platform-browser';
    import { FormsModule }   from '@angular/forms';       
    import { AppComponent }  from './app.component';
    import {AppChildComponent} from './appchild.component';
    @NgModule({
      imports:      [ BrowserModule,FormsModule ],
      declarations: [ AppComponent, AppChildComponent ],
      bootstrap:    [ AppComponent ]
    })
    export class AppModule { }

আশা করি এটা সাহায্য করবে


ধন্যবাদ! আমি এটিকে আমদানি বিভাগে ঘোষণা করিনি এবং আমি যখন একটি উপাদানকে একটি উপ-মডিউলে স্থানান্তরিত করেছি তখন এটি আমাকে উন্মাদ করে তুলছিল।
রিচার্ড

30

এই উপাদানটি মূল যেমন অ্যাপ্লিকেশন.মডিউল.টসে থাকলে আপনার রুট মডিউলে আপনাকে ফর্মমডুলি আমদানি করতে হবে

দয়া করে app.module.ts খুলুন

@ কৌনিক / ফর্মগুলি থেকে ফর্মস মডেল আমদানি করুন

উদা:

import { FormsModule } from '@angular/forms';

এবং

@NgModule({
imports: [
   FormsModule
],
})

28

আমি কৌনিক 7 ব্যবহার করছি

আমাকে রিএ্যাকটিভ ফর্মস মড্যুল আমদানি করতে হবে কারণ আমি প্রতিক্রিয়াশীল ফর্ম তৈরি করতে ফর্মবিল্ডার ক্লাসটি ব্যবহার করছি।

import { 
FormsModule, 
ReactiveFormsModule } from '@angular/forms';

@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    ReactiveFormsModule
  ], declarations: []})

24

আপনার অ্যাপ্লিকেশন মডিউলে ফর্মমডুল আমদানি করুন।

এটি আপনার অ্যাপ্লিকেশনটি ভালভাবে চলতে দেবে।

import { NgModule }      from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import {ContactListCopmponent} from './contacts/contact-list.component';
import { FormsModule }   from '@angular/forms';

import { AppComponent }  from './app.component';

@NgModule({
  imports: [
    BrowserModule,
    FormsModule
  ],
  declarations: [
    AppComponent,ContactListCopmponent
  ],
  bootstrap: [ AppComponent ]
})
export class AppModule { }

22

আপনি ব্যবহার করতে চান, তাহলে [(ngModel)]প্রথম আপনি আমদানি করতে হবে FormsModuleসালে app.module.tsএবং তারপর আমদানির একটি তালিকাতে যোগ করুন। এটার মতো কিছু:

app.module.ts

  1. আমদানি import {FormsModule} from "@angular/forms";
  2. আমদানি যোগ করুন imports: [ BrowserModule, FormsModule ],

app.component.ts

  1. উদাহরণ: <input type="text" [(ngModel)]="name" >
  2. এবং তারপর <h1>your name is: {{name}} </h1>

19

ngModel হ'ল ফর্মস মোডুলের অংশ। এবং এটি @ কৌনিক / ফর্মগুলি থেকে এনজিএমডেলের সাথে কাজ করতে আমদানি করা উচিত।

নিম্নলিখিত হিসাবে app.module.ts পরিবর্তন করুন:

import { FormsModule } from '@angular/forms';

[...]

@NgModule({
  imports: [
    [...]
    FormsModule
  ],
  [...]
})

18

গৃহীত সমাধানটি প্রয়োগ করার পরে যদি কেউ এখনও ত্রুটি পেতে থাকে তবে সম্ভবত এটি হতে পারে কারণ আপনি যে উপাদানটিতে ইনপুট ট্যাগে এনজিমোডেল সম্পত্তিটি ব্যবহার করতে চান তার জন্য একটি পৃথক মডিউল ফাইল রয়েছে। সেক্ষেত্রে উপাদানটির মডিউল.এসটি ফাইলে গ্রহণযোগ্য সমাধানটিও প্রয়োগ করুন।


18

আমি কৌনিক 5 ব্যবহার করছি।

আমার ক্ষেত্রে, আমাকে রেসিটিভ ফরমস মডুলেলও আমদানি করা দরকার।

app.module.ts (বা যে কোনও মডুল.মডিউল.টস)

import { FormsModule, ReactiveFormsModule } from '@angular/forms';

@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    ReactiveFormsModule
  ],

ReactiveFormsModuleআপনার যখন প্রয়োজন হয় তখন প্রয়োজন হয় FormGroup, FormControl ,Validatorsইত্যাদি ব্যবহারের জন্য আপনার প্রয়োজন হয় ngModelনা ReactiveFormsModule
অমিত চিগদানি

অ্যামিটচিগদানি রিঅ্যাকটিভফর্মমডুল যুক্ত করা আমার পক্ষে সমস্যাটি কেবল দূরে চলে গেল। আমি কৌনিক 7 ব্যবহার করছি।
শাশ্বত 21

17

আমি জানি এই প্রশ্নটি কৌনিক 2 সম্পর্কে, তবে আমি কৌণিক 4 এ আছি এবং এর উত্তরগুলির কোনওটিই সহায়তা করেনি।

কৌণিক 4 এ সিনট্যাক্স হওয়া দরকার

[(ngModel)]

আশাকরি এটা সাহায্য করবে.


15

আপনি যদি এখনও সঠিকভাবে ফর্মস মডেল আমদানির পরে ত্রুটি পেয়ে থাকেন তবে আপনার টার্মিনাল বা (উইন্ডোজ কনসোল) পরীক্ষা করুন কারণ আপনার প্রকল্পটি সংকলন করছে না (অন্য কোনও ত্রুটির কারণে যা কিছু হতে পারে) এবং আপনার সমাধানটি আপনার ব্রাউজারে প্রতিফলিত হয়নি!

আমার ক্ষেত্রে, আমার কনসোলে নিম্নলিখিত সম্পর্কিত নয় error


13

মডিউলটিতে আপনি এনজিমোডেল ব্যবহার করতে ইচ্ছুক আপনাকে ফর্মস মডেল আমদানি করতে হবে

import { FormsModule } from '@angular/forms';

@NgModule({
  imports: [
    FormsModule,
  ],

})
export class AbcModule { }

আমি আমার অ্যাপ্লিকেশনটিতে এটি মিস করছি mod
ওমজিগ

11

এনজিমোডেল ফর্মস মোডুল থেকে আসছে T আপনি যখন এই ধরণের ত্রুটি পেতে পারেন তখন কিছু ক্ষেত্রে রয়েছে:

  1. আপনি যে উপাদানটি এনজিমোডেল ব্যবহৃত হয় সেই উপাদানটি ঘোষিত মডিউলের আমদানির অ্যারেগুলিতে আপনি ফর্মসমডুল আমদানি করেননি।
  2. আপনি একটি মডিউলে ফর্মসমডুল আমদানি করেছেন যা অন্য মডিউলের উত্তরাধিকার সূত্রে প্রাপ্ত। এক্ষেত্রে আপনার দুটি বিকল্প রয়েছে:
    • দুটি মডিউল: মডিউল 1 এবং মডিউল 2 থেকে আমদানি অ্যারেতে ফর্মস মডুলেল আমদানি করা যাক। নিয়ম হিসাবে: একটি মডিউল আমদানি করা তার আমদানি করা মডিউলগুলিতে অ্যাক্সেস সরবরাহ করে না ((আমদানি উত্তরাধিকার সূত্রে প্রাপ্ত হয় না)

এখানে চিত্র বর্ণনা লিখুন

  • মডেল 2 এও এটি দেখতে সক্ষম হওয়ার জন্য মডিউল 1-এ আমদানি-রফতানি অ্যারেগুলিতে ফর্মসোডলটি ঘোষণা করুন

এখানে চিত্র বর্ণনা লিখুন

  1. (কিছু সংস্করণে আমি এই সমস্যার মুখোমুখি হয়েছি) আপনি ফর্মসমডুল সঠিকভাবে আমদানি করেছেন তবে সমস্যাটি ইনপুট এইচটিএমএল ট্যাগে রয়েছে। আপনাকে অবশ্যই ইনপুটটির জন্য নামের ট্যাগের বৈশিষ্ট্যটি যুক্ত করতে হবে এবং [(ngModel)] এ অবজেক্টের বাউন্ড নামটি অবশ্যই নামের বৈশিষ্ট্যের সাথে নামের মতো হতে হবে

    এখানে চিত্র বর্ণনা লিখুন


11

ইন ngModuleআপনার দ্বারা আমদানি প্রয়োজন FormsModule, কারণ ngModelথেকে আসছে FormsModule। নীচের কোডটি আমি ভাগ করে নিয়েছি দয়া করে আপনার app.module.ts পরিবর্তন করুন

import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';

@NgModule({
    declarations: [
         AppComponent,
         HomeComponent
    ],
    imports: [
         BrowserModule,
         AppRoutingModule,
         FormsModule
    ],
    bootstrap: [AppComponent]
})
export class AppModule { }

10

আমদানি করুন formModule একটি app.module mod

import { FormsModule } from '@angular/forms'; [...] @NgModule({ imports: [ [...] FormsModule ], [...] })

9
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { AppComponent } from './app.component';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    FormsModule     
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule {}

8

কখনও কখনও আপনি একটি মডিউল, যা ভাগ না করা একটি মডিউল থেকে কোনও উপাদান ব্যবহার করার চেষ্টা করার সময় আপনি এই ত্রুটিটি পান।

উদাহরণস্বরূপ, আপনার কাছে মডিউল 1.componalA.componal.ts এবং মডিউল 2.componalC.componal.ts সহ 2 টি মডিউল রয়েছে এবং আপনি মডিউল 2 (উদাঃ <module1-componentA [someInputVariableInModule1]="variableFromHTTPRequestInModule2">) এর অভ্যন্তরে একটি টেম্পলেটে मॉड्यूल 1.componalA.componal.ts থেকে নির্বাচকটি ব্যবহার করার চেষ্টা করছেন , এটি নিক্ষেপ করবে মডিউল 1.componalA.componal.ts- এর ভিতরে কিছু ইনপুটভেরিয়েবলআইনমোডিয়ুল 1 উপলব্ধ নয় এমন ত্রুটি - যদিও আপনার@Input() someInputVariableInModule1 module1.componentA হবে।

যদি এটি ঘটে থাকে তবে অন্যান্য মডিউলগুলিতে অ্যাক্সেসযোগ্য হওয়ার জন্য আপনি মডিউল 1.com অংশটি ভাগ করতে চান। সুতরাং যদি আপনি একটি শেয়ারডমডুলের মধ্যে মডিউল 1.com অংশীদারটি ভাগ করেন তবে মডিউল 1.componalA অন্যান্য মডিউলগুলির মধ্যে (মডিউল 1 থেকে বাইরে) ব্যবহারযোগ্য হবে, এবং ভাগ করা মডিউল আমদানি করা প্রতিটি মডিউল @Input()ঘোষিত ভেরিয়েবল ইনজেকশন দেওয়ার জন্য তাদের টেম্পলেটগুলিতে নির্বাচককে অ্যাক্সেস করতে সক্ষম হবে ।


1
আমার এই হুবহু সমস্যা আছে এবং আপনি বলছেন, আপনার মডিউলটি ভাগ করা উচিত যাতে আপনি কম্পোনেন্ট সি তে কম্পোনেন্টএ ব্যবহার করতে পারেন। তবে .. আমি কিভাবে মডিউল 1 ভাগ করব? "একটি মডিউল ভাগ করতে" সিনট্যাক্স কোনটি? আমি মডিউল 1 রফতানি করার অনুমান করেছি এবং তারপরে এটি মডিউল 2 এ আমদানি করা যথেষ্ট পরিমাণে ভাগ করে নেওয়া হয়েছিল, তবে এখনও এই সমস্যাটি রয়েছে
অ্যাগ্ররিলা

2
আমার নিজের উত্তর দেওয়ার জন্য, আপনি এভাবেই
অ্যাগ্ররিলা

2
আরে দুঃখিত, আমি আপনার মন্তব্যটি দ্রুত দেখতে পেলাম না :) হ্যাঁ, আপনি এইভাবে একটি শ্যারডমডুল তৈরি করতে এবং সেখানে নিজের মডিউলগুলি আমদানি করতে পারেন, যা আপনি অন্য একাধিক মডিউলগুলিতে ব্যবহার করতে চান। তারপরে আপনি SharedModule আমদানি করুন যেখানে আপনি ভাগ করা একটিতে আমদানি করা মডিউলটি ব্যবহার করতে চান।
গুনট্রাম

8

আমার দৃশ্যের জন্য, আমাকে আমার মডিউলটিতে [কমনমডিউল] এবং [ফর্মস মডেল] উভয়ই আমদানি করতে হয়েছিল

import { NgModule } from '@angular/core' 
import { CommonModule } from '@angular/common'; 
import { FormsModule } from '@angular/forms'; 

import { MyComponent } from './mycomponent'

@NgModule({
    imports: [
        CommonModule,
        FormsModule
    ],
    declarations: [
        MyComponent 
    ]
 }) 
export class MyModule { }

8

আপনার ফর্মমডুল আমদানি করতে হবে

App.module.ts খুলুন

এবং লাইন যুক্ত করুন

import { FormsModule } from '@angular/forms';

এবং

@NgModule({
imports: [
   FormsModule
],
})

8

কখনও কখনও, যদি আমরা ইতিমধ্যে আমদানি করা হয় BrowserModule, FormsModuleএবং অন্যান্য সম্পর্কিত মডিউল যদিও আমি একই ভুল পেয়েছিলাম তারপর আমি বুঝলাম যে আমরা তাদের অর্ডার আমদানি করার প্রয়োজন , আমার ক্ষেত্রে আমি এটা মিস করেছি। তাই যাতে কেমন হওয়া উচিত BrowserModule, FormsModule, ReactiveFormsModule

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { AppComponent } from './app.component';

@NgModule({
  imports: [
    BrowserModule,
    FormsModule,
    ReactiveFormsModule     
  ],
  providers: [],
  declarations: [
    AppComponent
  ],
  bootstrap: [AppComponent]
})
export class AppModule {}

আশা করি এটি কারও সাহায্য করবে .. :)


7

এটি এমন লোকদের জন্য যারা টাইপ স্ক্রিপ্টের পরিবর্তে সরল জাভাস্ক্রিপ্ট ব্যবহার করেন। নীচের মত পৃষ্ঠার উপরে ফর্ম স্ক্রিপ্ট ফাইল উল্লেখ ছাড়াও

<script src="node_modules/@angular/forms/bundles/forms.umd.js"></script>

মডিউল লোডারটি লোড করার জন্য আপনাকেও বলা উচিত ng.forms.FormsModule। পরিবর্তনগুলি করার পরে আমার পদ্ধতির importsসম্পত্তিটি NgModuleনীচের মত দেখাচ্ছে

imports: [ng.platformBrowser.BrowserModule, ng.forms.FormsModule],

শুভ কোডিং!


6

আমি আরসি 1 থেকে আরসি 5 এ আপগ্রেড করেছি এবং এই ত্রুটিটি পেয়েছি।

আমি আমার মাইগ্রেশন সম্পন্ন করেছি (একটি নতুন app.module.tsফাইল প্রবর্তন , package.jsonনতুন সংস্করণ এবং অনুপস্থিত মডিউলগুলি অন্তর্ভুক্ত করার জন্য পরিবর্তন করা এবং অবশেষে অ্যাংুলার 2 দ্রুত সূচনা উদাহরণেরmain.ts ভিত্তিতে আমার বুট অনুসারে পরিবর্তন করা ) completed

ইনস্টল করা সংস্করণগুলি সঠিক ছিল তা নিশ্চিত করার জন্য আমি একটি npm updateএবং তারপরে একটি করেছি npm outdated, এখনও ভাগ্য নেই।

আমি node_modulesফোল্ডারটি পুরোপুরি মুছতে এবং পুনরায় ইনস্টল করে শেষ করেছি npm install- ভয়েলা! সমস্যা সমাধান.


5

আমি যখন প্রথম টিউটোরিয়ালটি করেছি তখন মেইন.টস এখনকার চেয়ে কিছুটা আলাদা দেখায়। এটি দেখতে খুব অনুরূপ, তবে পার্থক্যগুলি লক্ষ্য করুন (উপরেরটিটি সঠিক)।

সঠিক:

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app.module';

platformBrowserDynamic().bootstrapModule(AppModule);

পুরাতন টিউটোরিয়াল কোড:

import { bootstrap }    from '@angular/platform-browser-dynamic';
import { AppComponent } from './app.component';
bootstrap(AppComponent);

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.