javascript 'NgModel' এ বাঁধা যাবে না কারণ এটি 'ইনপুট' এর পরিচিত সম্পত্তি নয়





11 Answers

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

javascript angular typescript 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";
}



এই মধ্যে নিক্ষেপ কেউ সাহায্য করতে পারে।

আপনি একটি নতুন NgModule তৈরি করেছেন, অনুমান করুন আপনার Auth প্রয়োজনগুলি পরিচালনা করার জন্য নিবেদিত FormsModule , সেই AuthModule এও ফর্মস FormsModule আমদানি করতে ভুলবেন না

আপনি যদি FormsModule কেবলমাত্র FormsModule ব্যবহার করতে চান তবে আপনাকে ডিফল্ট AppModuleFormModule আমদানি করতে হবে না।

সুতরাং 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 { }

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




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

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

মূলত 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 { }

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




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

app.module.ts

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

app.component.ts

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



সহজ সলশন : app.module.ts মধ্যে

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

imports: [
 BrowserModule,
 FormsModule
 ],

উদাহরণ 2 :

যদি আপনি [(ngModel) ব্যবহার করতে চান] তবে আপনাকে app.module.ts এ ফর্মস মডিউল আমদানি করতে হবে।

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

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



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

আমার ক্ষেত্রে, আমি RactiveFormsModule খুব আমদানি করতে হবে।

app.module.ts (অথবা anymodule.module.ts)

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

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



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 {}



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

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 { }



মডিউলে আপনি ngModel ব্যবহার করতে ইচ্ছুক, আপনাকে FormsModule আমদানি করতে হবে

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

@NgModule({
  imports: [
    FormsModule,
  ],

})
export class AbcModule { }



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

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

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

আমি সম্পূর্ণরূপে node_modules ফোল্ডার wiping শেষ এবং npm install সঙ্গে পুনরায় npm install - Voila! সমস্যা সমাধান.




কৌণিক 2 এর যেকোনো সংস্করণের জন্য, আপনার app.module.ts ফাইলে ফর্মস মডিউল আমদানি করতে হবে এবং এটি সমস্যাটি সমাধান করবে।




Related