27
ERROR TypeError: jit_nodeValue_4(...).$any is not a function
at Object.eval [as handleEvent] (AddNewConnectionsComponent.html:42)
at handleEvent (core.js:13581)
at callWithDebugContext (core.js:15090)
at Object.debugHandleEvent [as handleEvent] (core.js:14677)
at dispatchEvent (core.js:9990)
at eval (core.js:10611)
at HTMLInputElement.eval (platform-browser.js:2628)
at ZoneDelegate.invokeTask (zone.js:421)
at Object.onInvokeTask (core.js:4744)
at ZoneDelegate.invokeTask (zone.js:420)

I am getting this error on required filed of form group.

My ts file code

        import { Component, OnInit } from '@angular/core';
        import { FormBuilder, Validators, FormGroup, FormControl } from '@angular/forms'
         import {ActivatedRoute, Router} from "@angular/router";

     @Component({
   selector: 'app-add-new-connections',
 templateUrl: './add-new-connections.component.html',
 styleUrls: ['./add-new-connections.component.scss']
})
export class AddNewConnectionsComponent {

 addNewConnectionForm: any;

 constructor(public fb: FormBuilder) { 
 this.addNewConnectionForm = new FormGroup({
  'connection_name': new FormControl("", [
    Validators.required
  ])
});

My Html file code

<form [formGroup]="addNewConnectionForm" (ngSubmit)="saveConnection()" novalidate>
            <div class="col-sm-4"> 
<div class="form-group">
                  <label>Connection Name ?</label>
                  <input type="text" name="name" placeholder="" (change)="changeFun()" class="form-control" required>
                  <div *ngIf=>
                      Name is required.
                    </div>
                  <small [hidden]="addNewConnectionForm.controls.connection_name.valid" class="text-danger">Required</small>
              </div>
            </div>
            <button type="submit" [disabled]="!addNewConnectionForm.valid">Submit</button>
          </form>

I have tried almost everything avalible. But I am not able to find any solution I have imported FormsModule and ReactiveFormsModule in my app.module.ts file Can you please suggest me a way how i can do it

2
  • Having the same issue after deleting the node modules folder and doing a npm install
    – v1shva
    Jan 14, 2018 at 10:47
  • @arpit, please mark answer as correct! Mar 31, 2020 at 8:27

4 Answers 4

52

For me the issue was different.

I was using Angular material menu. In the template the menu declared a local variable like this <mat-menu #share='matMenu'>. share was also the name of the function I wanted to call in the component, which was now overwritten. Changing one of the names fixed this.

2
  • 7
    Oh man, I wasted my whole weekend on this issue. Thank you So much. I wish I could do more ups to this answer. :) Feb 4, 2019 at 6:39
  • 2
    Name collision issue
    – Techdive
    Aug 13, 2019 at 5:28
10

This normally happens when you've got two references of different data types with the same name. So you might have a Template Reference Variable of #logout and a button that calls logout() on click. Clicking the button would throw an error like the one you're getting.

4

Using the command line go to the same directory as the package.json file of the application that you want to update.

Run npm outdated and you will see a list of packages that need updating. My app is fairly new so updating all was not an issue (if you need to update specific packages this will help you). To do a full update run npm update, if you re-run npm outdated you will see everything is up to date, BUT you application may not compile now. The error message I got wasn't very helpful. To resolve this problem check all your import statement are still valid (one of mine was altered in app.module.ts)

import { AppRoutingModule } from './app-routing.module'; was changed to import { AppRoutingModule } from './/app-routing.module';

hope this helps

0

I am getting same issue in Angular 5 and I updated npm package by npm update and problem resolved for me, there was some issue in angular dependencies so I updated it.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.