jit_nodeValue_4(...).$any 不是 Angular5 的函数答案

【问题标题】：jit_nodeValue_4(...).$any is not a function Angular5jit_nodeValue_4(...).$any 不是 Angular5 的函数
【发布时间】：2018-06-20 20:55:56
【问题描述】：

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>

我已经尝试了几乎所有可用的方法。但我找不到任何解决方案我在 app.module.ts 文件中导入了 FormsModule 和 ReactiveFormsModule 你能建议我一种方法吗

【问题讨论】：

删除节点模块文件夹并执行 npm install 后遇到同样的问题
@arpit，请将答案标记为正确！

标签： angular angular5 angular2-template angular2-forms angular4-forms

【解决方案1】：

对我来说问题是不同的。

我使用的是 Angular 材质菜单。在模板中，菜单声明了一个像 <mat-menu #share='matMenu'> 这样的局部变量。 share 也是我想在组件中调用的函数的名称，现在已被覆盖。更改其中一个名称可以解决此问题。

【讨论】：

天哪，我在这个问题上浪费了整个周末。太感谢了。我希望我能为这个答案做更多的事情。 :)
名称冲突问题

【解决方案2】：

当您有两个具有相同名称的不同数据类型的引用时，通常会发生这种情况。所以你可能有一个#logout 的模板引用变量和一个在点击时调用logout() 的按钮。单击该按钮会引发与您遇到的错误类似的错误。

【讨论】：

【解决方案3】：

使用命令行转到与您要更新的应用程序的package.json 文件相同的目录。

运行npm outdated，您将看到需要更新的软件包列表。我的应用程序相当新，因此更新所有应用程序都不是问题（如果您需要更新特定软件包 this will help you）。要进行完整更新运行npm update，如果您重新运行npm outdated，您将看到一切都是最新的，但是您的应用程序现在可能无法编译。我收到的错误消息不是很有帮助。要解决此问题，请检查您的所有导入语句是否仍然有效（我的一个已在 app.module.ts 中更改）

import { AppRoutingModule } from './app-routing.module'; 改为import { AppRoutingModule } from './/app-routing.module';

希望对你有帮助

【讨论】：

【解决方案4】：

我在 Angular 5 中遇到了同样的问题，我通过 npm update 更新了 npm 包，问题为我解决了，角度依赖存在一些问题，所以我更新了它。

【讨论】：