Error: Cannot assign value "$event" to template variable "emailBody". Template variables are read-only.

First of all, binding ngModel to your local variable X from.ts is not possible using #emailBody="ngModel."

A new template variable emailBody will be bound to the instance of the Angular directive ngModel, which has nothing to do with your.ts variable. The only place a template variable may be found is in your component's.html (unless you use @ViewChild or a similar method to retrieve a reference in your.ts).

Here is old cod that has this issue :

 <div class="ed_contact_form ed_toppadder60 row m-0">

        <div class="col-lg-6 col-md-6 col-sm-12">

          <div class="form-group">

            <input type="text" id="uname" class="form-control"

                    placeholder="Your Name">

          </div>

          <div class="form-group">

            <input type="email" id="fromEmail" class="form-control"

            placeholder="Your Email" name="fromEmail" #fromEmailt="ngModel"

                [(ngModel)]="fromEmail">

          </div>

          <div class="form-group">

            <input type="text" id="emailSubject" class="form-control"

            placeholder="emailSubject" required #emailSubject="ngModel"

            [ngModel]="emailSubject">

          </div>

        </div>

        <div class="col-lg-6 col-md-6 col-sm-12">

          <div class="form-group">

            <textarea id="emailBody" class="form-control" rows="6"

                placeholder="emailBody" required  #emailBody="ngModel"

                [(ngModel)]="emailBody"></textarea>

          </div>

         

        </div>

New Codde Ater Fixes 

your component variable name, and directive name should not be the same. 

to fix it I have added #emailBoddy1  instead of #emailBody.

<div class="ed_contact_form ed_toppadder60 row m-0">

  <div class="col-lg-6 col-md-6 col-sm-12">

    <div class="form-group">

      <input type="text" id="uname" class="form-control"

              placeholder="Your Name">

    </div>

    <div class="form-group">

      <input type="email" id="fromEmail" class="form-control"

      placeholder="Your Email" name="fromEmail" #fromEmailt1="ngModel"

          [(ngModel)]="fromEmail">

    </div>

    <div class="form-group">

      <input type="text" id="emailSubject" class="form-control"

      placeholder="emailSubject" required #emailSubject1="ngModel"

      [ngModel]="emailSubject">

    </div>

  </div>

  <div class="col-lg-6 col-md-6 col-sm-12">

    <div class="form-group">

      <textarea id="emailBody" class="form-control" rows="6"

          placeholder="emailBody" required  #emailBody1="ngModel"

          [(ngModel)]="emailBody"></textarea>

    </div>

   

  </div>