java script expectedエラー

Question

Angularのチュートリアル(URL)を現在行っています。

import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';

import { products } from '../products';
import { CartService } from '../cart.service';


@Component({
  selector: 'app-product-details',
  templateUrl: './product-details.component.html',
  styleUrls: ['./product-details.component.css']
})

export class ProductDetailsComponent implements OnInit {
  constructor(
    private route: ActivatedRoute,
    private cartService: CartService
  ){ }
}

export class ProductDetailsComponent implements OnInit {
  addToCart(product){
    window.alert('Your product has been added to the cart!');
    this.cartService.addToCart(product);
  }
}

  ngOnInit() {
    this.route.paramMap.subscribe(params => {
      this.product = products[+params.get('productId')];
    });
  }

}

コードは上記のもので
エラーは下記に示します

Error in src/app/product-details/product-details.component.ts (28:14)
';' expected.

よろしくお願いいたします

Comments

[Lhankor_Mhy]

かっこの対応があっていないようですが、実際のコードではどうなっていますか？

[dkymmmmmt]

修正の依頼ありがとうございます。
最後の}を削除しました

[Lhankor_Mhy]

> 最後の}を削除しました

それで、動作します？？　
ngOnInit はメソッドですよね？　Angular 詳しくないので間違っていたら申し訳ないのですが、文法的におかしいような……？

[dkymmmmmt]

動作はしていないです。
私もAngularのチュートリアルを写経している段階なので・・・

[Lhankor_Mhy]

写経、ということはお手本のコードがあるのですよね？
ご提示された方が回答がつくのでは？

[Lhankor_Mhy]

ほんとに Angular わからないので、なんとなくフィーリングで、

export class ProductDetailsComponent implements OnInit {
constructor(
){ }
addToCart(product){
}
ngOnInit() {
}
}

こんな感じに書くんじゃないのかな、と思いました。

[dkymmmmmt]

ご指摘ありがとうございます。URL追記致しました

[Lhankor_Mhy]

URL拝見。
やはり、上記したような構造だと思いますよ。

[og24715]

もう答え出てますね。どうして ProductDetailsComponent クラス２回定義してるんですか？

Answer 1

あまりよくわかりませんが、こんな感じでは。

export class ProductDetailsComponent implements OnInit {

  constructor(
    private route: ActivatedRoute,
    private cartService: CartService
  ){ }

  addToCart(product){
    window.alert('Your product has been added to the cart!');
    this.cartService.addToCart(product);
  }

  ngOnInit() {
    this.route.paramMap.subscribe(params => {
      this.product = products[+params.get('productId')];
    });
  }

}