কৌণিক 2 যদি এনজিমোডেল কোনও ফর্ম ট্যাগের মধ্যে ব্যবহার করা হয় তবে নামটির বৈশিষ্ট্যটি অবশ্যই সেট করা উচিত বা ফর্মটি


216

আমি এই ত্রুটিটি কৌনিক 2 থেকে পাচ্ছি

core.umd.js: 5995 উত্সাহ: আনকাডড (প্রতিশ্রুতিতে): ত্রুটি: অ্যাপ / মডেল_এক্সপোজার_ক্রেন্সিগুলিতে ত্রুটি: সেট বা ফর্ম নিয়ন্ত্রণ অবশ্যই ngModelOptions এ 'স্ট্যান্ডেলোন' হিসাবে সংজ্ঞায়িত করা উচিত।

      Example 1: <input [(ngModel)]="person.firstName" name="first">
      Example 2: <input [(ngModel)]="person.firstName" [ngModelOptions]="{standalone: true}">
<td *ngFor="let lag of ce.lags">
    <div class="form-group1">
        <input name="name" [(ngModel)]="lag.name" [ngModelOptions]="{standalone: true}"  class="form-control" pattern="[0-9]*(\.[0-9]+)?" required>
    </div>

</td>

এইভাবে আমি ফর্ম ট্যাগটি ব্যবহার করি:

 <form #f="ngForm" (ngSubmit)="onSubmit()">

2
কোসাইডার উত্তরগুলির মধ্যে একটিকে সঠিক হিসাবে পুরষ্কার দিচ্ছেন
জি স্টোনেভ

উত্তর:


420

যদি এনজিএফর্ম ব্যবহার করা হয়, সমস্ত ইনপুট ক্ষেত্রগুলির একটি মান সহ একটি বিশিষ্ট নাম[(ngModel)]="" থাকতে হবে ।

<input [(ngModel)]="firstname" name="something">


1
নামের বৈশিষ্ট্যের একটি অনন্য মূল্য থাকতে হবে?
আলেকজান্ডার মিলস

2
কৌণিক 5 ডকুমেন্টেশন থেকে ( কৌণিক.ইও / গুইড / সফটওয়্যার ): "[[এনজিমোডেল)] ফর্মের সাথে সংমিশ্রণ করার সময় একটি নাম বৈশিষ্ট্য নির্ধারণ করা প্রয়োজন" "
এলশেভ

2
কৌনিক 7 তেও প্রযোজ্য!
কোডারপিসি

2
আমি যুক্ত করতে চাই যে এনজিএমডেল নামের আগে প্রথমে আসে তবে এটি কাজ করবে।
রোনাল্ড আবেলানো

55

প্রতিটি বিকাশকারীর যেমন একটি সাধারণ অভ্যাস থাকে, সম্পূর্ণ ত্রুটিটি না পড়েন, কেবল প্রথম লাইনটি পড়ুন এবং অন্য কারও কাছ থেকে উত্তর খোঁজা শুরু করুন :) :) আমিও তাদের মধ্যে একজন, এ কারণেই আমি এখানে আছি:

ত্রুটিটি পড়ুন, স্পষ্টভাবে বলেছেন:

Example 1: <input [(ngModel)]="person.firstName" name="first">
Example 2: <input [(ngModel)]="person.firstName" [ngModelOptions]="{standalone: true}">

এই ত্রুটিটি আরও আমাদের কী বুঝতে হবে?

যে কোনও একটি বিকল্প ব্যবহার করুন সবকিছু মসৃণভাবে কাজ করবে।


25
প্রতিটি বিকল্পের অন্তর্নিহিত / প্রভাবের ব্যাখ্যা কার্যকর হবে - দুজনের মধ্যে যথেচ্ছভাবে বেছে নেওয়া কোনও ভাল ধারণা বলে মনে হয় না।
মাইকেল 10

2
তোমাকে ভালোবাসি :)))))
লোলা

1
এখানে স্ট্যাকওভারফ্লো . com/ a [ngModelOptions]="{standalone: true}/ 38368261 / 3135317 এর জন্য একটি ভাল ব্যাখ্যা । আমার ক্ষেত্রে, আমি ভয় পেয়েছি `ng মডেলটি একটি ফর্ম ট্যাগের মধ্যে ব্যবহৃত হয়, হয় নাম বৈশিষ্ট্যটি অবশ্যই ...` ত্রুটি যখন আমার একটি নেস্টেড অ্যারের জন্য একটি `* এনজিফোর্ড * ছিল। মডেল বাইন্ডিং ভাল ছিল, টেমপ্লেট বাফড। "উদাহরণ 1" কাজ করতে পারে না ; "উদাহরণ 2" নিখুঁত ছিল।
ফোগিডে

এই উত্তর আমাকে একই সপ্তাহে দু'বার সহায়তা করেছিল (এটি প্রথমবারের মতো দৃশ্যমান হয়নি);
জে কামিন্স ২

30

উভয় বৈশিষ্ট্য প্রয়োজন এবং সমস্ত ফর্ম উপাদানগুলির "নাম" বৈশিষ্ট্যটিও যাচাই করে নিন। আপনি যদি ফর্ম জমা দেওয়ার ধারণাটি ব্যবহার করছেন তবে অন্য জ্ঞানী কেবল ফর্ম এলিমেন্টের পরিবর্তে ডিভ ট্যাগ ব্যবহার করুন।

<input [(ngModel)]="firstname" name="something">

30

আমার ক্ষেত্রে ত্রুটিটি ঘটেছে কারণ নীচে এইচটিএমএল মার্কআপে নাম বৈশিষ্ট্য ছাড়াই আরও একটি লাইন বিদ্যমান ।

<form id="form1" name="form1" #form="ngForm">
  <div class="form-group">
    <input id="input1" name="input1" [(ngModel)]="metaScript" />
    ... 
    <input id="input2" [(ngModel)]="metaScriptMessage"/>
  </div>
</form>

তবে ব্রাউজারটি এখনও প্রথম সারিতে ত্রুটি রয়েছে বলে জানায়। এবং যদি এই দুজনের মধ্যে অন্য উপাদান থাকে তবে ভুলের উত্সটি আবিষ্কার করা শক্ত। এখানে চিত্র বর্ণনা লিখুন


16

আপনি যখন স্পষ্টভাবে কনসোলটি দেখবেন two এটি আপনাকে দুটি উদাহরণ দেবে these এগুলির কোনওটি বাস্তবায়ন করুন।

<input [(ngModel)]="person.firstName" [ngModelOptions]="{standalone:
   true}">

অথবা <input [(ngModel)]="person.firstName" name="first">


16

আমি লক্ষ্য করেছি যে ক্রোম বিকাশকারী সরঞ্জামটি কখনও কখনও কেবল নামের সাথে সঠিকভাবে সেট আপ করা সত্ত্বেও কেবলমাত্র প্রথম উপাদানটিকে রেডলাইজ করে। এটি আমাকে কিছুক্ষণের জন্য ফেলে দিল।

এক একটি যোগ করতে ভুলবেন না আবশ্যক নাম থেকে যে ফর্ম যে ngModel নির্বিশেষে যার মধ্যে একটি squiggly আন্ডারলাইন রয়েছে উপর উপাদান।


9

এটি ঠিক করার জন্য বেশ সহজ।

আমার জন্য, ফর্মটিতে আমাদের একাধিক ইনপুট রয়েছে। আমাদের ত্রুটিজনিত ইনপুট / লাইনটি আলাদা করতে হবে এবং কেবল nameবৈশিষ্ট্য যুক্ত করতে হবে । এটি আমার জন্য সমস্যাটি স্থির করেছে:

আগে:

<form class="example-form">

    <mat-form-field appearance="outline">

      <mat-select placeholder="Select your option" [(ngModel)]="sample.stat"> <!--HERE -->

          <mat-option *ngFor="let option of actions" [value]="option">{{option}</mat-option>
      </mat-select>
    </mat-form-field>

    <mat-form-field appearance="outline">
      <mat-label>Enter number</mat-label>

      <input id="myInput" type="text" placeholder="Enter number" aria-label="Number"
        matInput [formControl]="myFormControl" required [(ngModel)]="number">  <!--HERE -->

    </mat-form-field>

    <mat-checkbox [(ngModel)]="isRight">Check!</mat-checkbox> <!--HERE -->

  </form>

পরে: আমি শুধু যোগ nameজন্য গুণাবলীর selectএবং checkboxএবং যে সমস্যা সমাধান করা হয়েছে। নিম্নরূপ:

<mat-select placeholder="Select your option" name="mySelect" 
  [(ngModel)]="sample.stat"> <!--HERE: Observe the "name" attribute -->

<input id="myInput" type="text" placeholder="Enter number" aria-label="Number"
        matInput [formControl]="myFormControl" required [(ngModel)]="number">  <!--HERE -->

<mat-checkbox name="myCheck" [(ngModel)]="isRight">Check!</mat-checkbox> <!--HERE: Observe the "name" attribute -->

আপনি দেখতে হিসাবে nameগুণাবলী যুক্ত। আপনার ngModelনাম হিসাবে একই দেওয়া প্রয়োজন হয় না । কেবল nameবৈশিষ্ট্য সরবরাহ করা সমস্যার সমাধান করবে।


3

আপনার পেজ.টায় @ কৌনিক / ফর্মগুলি থেকে আপনার {এনজিএফর্ম import আমদানি করা দরকার;

কোড এইচটিএমএল:

<form #values="ngForm" (ngSubmit)="function(values)">
 ...
 <ion-input type="text" name="name" ngModel></ion-input>
 <ion-input type="text" name="mail" ngModel></ion-input>
 ...
</form>

আপনার পেজ.টসগুলিতে, ফর্ম ডেটা ম্যানিপুলেট করতে আপনার ফানসিওন প্রয়োগ করুন:

function(data) {console.log("Name: "data.value.name + " Mail: " + data.value.mail);}

3

এটা চেষ্টা কর...

    <input type="text" class="form-control" name="name" placeholder="Name"
                  required minlength="4" #name="ngModel"
                  ngModel>
                  <div *ngIf="name.errors && (name.dirty || name.touched)">
                      <div [hidden]="!name.errors.required" class="alert alert-danger form-alert">
                          Please enter a name.
                      </div>
                      <div [hidden]="!name.errors.minlength" class="alert alert-danger form-alert">
                          Enter name greater than 4 characters.
                      </div>
                  </div>

3

ত্রুটি বার্তায় নিজেই আতঙ্কিত হন না এমন প্রত্যেকের জন্য, তবে এখান থেকে উদাহরণ কেন কাজ করে না তা ব্যাখ্যা করার জন্য গুগলিং (যেমন পাঠ্য ইনপুট ক্ষেত্রে টাইপ করা হয় তখন ডায়নামিকাল ফিল্টারিং ঘটে না): এটি কাজ করবে না যতক্ষণ না আপনি ইনপুট ক্ষেত্রে নামের পরামিতি যুক্ত করবেন। পাইপ কেন কাজ করছে না তার ব্যাখ্যাটিতে কিছুই নির্দেশ করে না, তবে ত্রুটি বার্তা এই বিষয়টিকে নির্দেশ করে এবং গৃহীত উত্তর অনুসারে এটিকে ঠিক করা গতিশীল ফিল্টারকে কাজ করে তোলে makes


2

আপনি যে সংস্করণটি ব্যবহার করছেন তা উল্লেখ করেননি তবে আপনি যদি rc5 বা rc6 ব্যবহার করেন তবে সেই "পুরানো" ফর্মের স্ট্র্যাপটি অবচিত করা হয়েছে। "নতুন" ফর্ম কৌশলগুলির জন্য গাইডেন্সের জন্য এটি একবার দেখুন: https://angular.io/docs/ts/latest/guide/forms.html


2

আপনার পছন্দের ফর্মটিতে তথ্য প্রদর্শন করতে সক্ষম হতে আপনার আগ্রহের নামের সেই নির্দিষ্ট ইনপুটগুলি দেওয়া দরকার। আমি আপনার কাছে সুপারিশ করব:


<form #f="ngForm" (ngSubmit)="onSubmit(f)"> ...
<input **name="firstName" ngModel** placeholder="Enter your first name"> ...

2

আমার জন্য, সমাধানটি খুব সহজ ছিল। আমি <form>ট্যাগটিকে একটিতে পরিবর্তন করেছি <div>এবং ত্রুটিটি চলে যায়।


1
এটি কারণ আপনি ফর্মটি সরিয়ে করছেন, এভাবে ফর্মটি সরবরাহ করে এমন সমস্ত বৈশিষ্ট্য মুছে ফেলা হচ্ছে।
অ্যাস্ট্রো 8991

@ অ্যাস্ট্রো 8991 আমার কোনও বৈশিষ্ট্য নেই
জন হেন্কেল

0
<select name="country" formControlName="country" id="country" 
       class="formcontrol form-control-element" [(ngModel)]="country">
   <option value="90">Turkey</option>
   <option value="1">USA</option>
   <option value="30">Greece</option>
</select>
name="country"
formControlName="country" 
[(ngModel)]="country" 

এই তিনটি জিনিসই ফর্মগ্রুপের নির্দেশের মধ্যে এনজিমোডেল ব্যবহার করা দরকার।

নোট করুন যে একই নাম ব্যবহার করা উচিত।

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