Jit_nodeValue_4 (...). $any не является функцией Angular5

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)

Я получаю эту ошибку при обязательной подаче группы форм.

Мой код файла ts

        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
  ])
});

Мой HTML-код файла

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

Я пробовал почти все доступные. Но я не могу найти какое-либо решение Я импортировал FormsModule и ReactiveFormsModule в свой файл app.module.ts Можете ли вы предложить мне способ, как я могу это сделать.

Ответ 1

С помощью командной строки перейдите в тот же каталог, что и файл package.json приложения, которое вы хотите обновить.

Запустите npm outdated, и вы увидите список пакетов, которые нуждаются в обновлении. Мое приложение довольно новое, поэтому обновление все не было проблемой (если вам нужно обновить определенные пакеты это поможет вам). Чтобы выполнить полный запуск обновления npm update, при повторном запуске npm outdated вы увидите, что все обновлено, НО вы не можете компилировать приложение. Сообщение об ошибке, которое я получил, было не очень полезно. Чтобы устранить эту проблему, проверьте, что все ваши инструкции импорта все еще действительны (один из моих изменен в app.module.ts)

import { AppRoutingModule } from './app-routing.module'; был изменен на import { AppRoutingModule } from './/app-routing.module';

надеюсь, что это поможет

Ответ 2

Для меня проблема была в другом.

Я использовал меню Angular Material. В шаблоне меню объявлена локальная переменная, такая как <mat-menu #share='matMenu'>. share - это также имя функции, которую я хотел вызвать в компоненте, которая теперь была перезаписана. Изменение одного из имен исправило это.

Ответ 3

Я получаю ту же самую проблему в Angular 5, и я обновил пакет npm на npm update, и проблема была решена для меня, была некоторая проблема в зависимостях Angular, поэтому я обновил ее.