Angular 7 viewchild 抛出错误并且无法识别模态答案

【问题标题】：Angular 7 viewchild throwing error and not recognizing modalAngular 7 viewchild 抛出错误并且无法识别模态
【发布时间】：2019-02-24 05:47:51
【问题描述】：

我尝试使用@viewchild，但我不断收到错误：

import {Component, ElementRef, Input, ViewChild} from '@angular/core';
import {ActivatedRoute, Router} from '@angular/router';
import {ApiService} from '../../../api.service';
import { Category } from '../../../category';

@Component({
  selector: 'app-add-category',
  templateUrl: './add-category.component.html',
  styleUrls: ['./add-category.component.scss']
})
export class AddCategoryComponent {
  @Input() category = new Category();
  public id: string;

  constructor(private route: ActivatedRoute, private router: Router, private data: ApiService) {}
  onSubmit() {
    @ViewChild('submitModal') modal;
    this.id = this.route.snapshot.paramMap.get('id');
    this.category.company = '5c5392a3bc107f4452ee222f';
    this.data.postCategory(this.category).subscribe(data => {
      console.log(data);
    }, (err) => {
      console.log(err);
    });
  }
}

错误：

Error TS1146: Declaration expected.

我正在尝试使用 @viewChild 抓取一个 Dom 元素，然后在 onSubmit() 时关闭一个模式

【问题讨论】：

显示完整的ts代码
相关stackoverflow.com/questions/43618631/…
@PrashantPimpale 完成
@Input() category = new Category(); @ViewChild('submitModal') modal;

标签： angular typescript

【解决方案1】：

@ViewChild('submitModal') modal; 是您在方法中声明的属性，它不会那样工作。您应该在方法之外和类内部声明一个属性

export class AddCategoryComponent {
  @Input() category = new Category();
  public id: string;
  @ViewChild('submitModal') modal; //declare properties inside class, outside methods

  constructor(private route: ActivatedRoute, private router: Router, private data: ApiService) {}
  onSubmit() {

    this.id = this.route.snapshot.paramMap.get('id');
    this.category.company = '5c5392a3bc107f4452ee222f';
    this.data.postCategory(this.category).subscribe(data => {
      console.log(data);
    }, (err) => {
      console.log(err);
    });
  }
}

【讨论】：