web-dev-qa-db-ja.com

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>

私は利用可能なほとんどすべてを試しました。しかし、私はapp.module.tsファイルにFormsModuleとReactiveFormsModuleをインポートした解決策を見つけることができません

angularangular5angular2-templateangular2-formsangular4-forms
20
arpit dadheech

私にとっては、問題は異なっていました。

私はAngularマテリアルメニューを使用していました。テンプレートでは、メニューはこのような<mat-menu #share='matMenu'>。 shareは、コンポーネントで呼び出したい関数の名前でもあり、現在は上書きされています。名前の1つを変更すると、これが修正されました。

30
Patrick Geyer

コマンドラインを使用して、更新するアプリケーションのpackage.jsonファイルと同じディレクトリに移動します。

npm outdatedを実行すると、更新が必要なパッケージのリストが表示されます。私のアプリはかなり新しいので、すべてを更新することは問題ではありませんでした（特定のパッケージを更新する必要がある場合 これはあなたを助けます ）。完全な更新を実行するにはnpm updateを実行し、npm outdatedを再実行すると、すべてが最新であることがわかります[〜＃〜] but [〜＃〜 ]アプリケーションは現在コンパイルできない可能性があります。私が受け取ったエラーメッセージはあまり役に立ちませんでした。この問題を解決するには、インポートステートメントがすべて有効であることを確認します（app.module.tsで変更されたものの1つ）

import { AppRoutingModule } from './app-routing.module';はimport { AppRoutingModule } from './/app-routing.module';に変更されました

お役に立てれば

4
tony09uk

Angular 5で同じ問題が発生しています。npmパッケージをnpm updateと私のために問題が解決し、angular依存関係に問題があったので更新しました。

0
Vinit Solanki