Getting a typescript error that I spent a couple hours trying to fix. It's pointing at my game-detailsponent.ts(26,54) and it looks totally fine to me.

Also when I CTR + S in my game-detailponent webpack Compiles successfully and my program works fine. Can anyone explain to me why it works like that?

Here is the code:

import { Component, OnInit, Input } from '@angular/core';
import { ActivatedRoute, Params } from '@angular/router';
import { Location } from '@angular/mon';

import { GameService } from '../../game.service';
import { UserComment } from '../../ment.model';

@Component({
  selector: 'app-game-detail',
  templateUrl: './game-detailponent.html',
  styleUrls: ['./game-detailponent.css'],
  providers: [GameService]
})
export class GameDetailComponent implements OnInit {

  gameKey: string;
  gameDetail;

  constructor(private route: ActivatedRoute, private location: Location, private gameService: GameService) { }

  ngOnInit() {
    this.route.params.forEach((urlParameters)=> {
      this.gameKey = urlParameters['id'];
    });
    this.gameService.getGameByKey(this.gameKey).subscribe(dataLastEmittedFromObserver => {
       this.gameDetail = dataLastEmittedFromObserver;);
      }

      addComment(: string) {
      const newComment: UserComment = new UserComment();
      this.gameDetailments.push(newComment);
      this.gameService.updateComments(this.gameDetail);
      // this.toggleDisplay();
    }
}

Getting a typescript error that I spent a couple hours trying to fix. It's pointing at my game-details.ponent.ts(26,54) and it looks totally fine to me.

Also when I CTR + S in my game-detail.ponent webpack Compiles successfully and my program works fine. Can anyone explain to me why it works like that?

Here is the code:

import { Component, OnInit, Input } from '@angular/core';
import { ActivatedRoute, Params } from '@angular/router';
import { Location } from '@angular/mon';

import { GameService } from '../../game.service';
import { UserComment } from '../../ment.model';

@Component({
  selector: 'app-game-detail',
  templateUrl: './game-detail.ponent.html',
  styleUrls: ['./game-detail.ponent.css'],
  providers: [GameService]
})
export class GameDetailComponent implements OnInit {

  gameKey: string;
  gameDetail;

  constructor(private route: ActivatedRoute, private location: Location, private gameService: GameService) { }

  ngOnInit() {
    this.route.params.forEach((urlParameters)=> {
      this.gameKey = urlParameters['id'];
    });
    this.gameService.getGameByKey(this.gameKey).subscribe(dataLastEmittedFromObserver => {
       this.gameDetail = dataLastEmittedFromObserver;);
      }

      addComment(: string) {
      const newComment: UserComment = new UserComment();
      this.gameDetail.ments.push(newComment);
      this.gameService.updateComments(this.gameDetail);
      // this.toggleDisplay();
    }
}

• javascript
• angular
• typescript

3 Answers 3

If you look at your code it has an issue inside the ngOnInit() where you have few misplaced paranthesis, change it as

ngOnInit() {
  this.route.params.forEach((urlParameters) => {
            this.gameKey = urlParameters['id'];
        });      
  this.gameService.getGameByKey(this.gameKey)
  .subscribe(dataLastEmittedFromObserver => {
            this.gameDetail = dataLastEmittedFromObserver;
        });
}

What you did is not close the bracket between parenthesis. Or misplaced the parenthesis. Depends on what you wanted to do.

You misplaced your brackets.

Try this:

this.gameService.getGameByKey(this.gameKey).subscribe(dataLastEmittedFromObserver => {
        this.gameDetail = dataLastEmittedFromObserver;
       });