속성 'article'은(는) 이니셜라이저가 없고 생성자에 할당되어 있지 않습니다.ts(2564)
공부중에 이런 에러가 떳다.
책은 3년 전 책이구 ts가 최신버전으로 업데이트 되면서 생기는 오류라고 한다..
import { Component, OnInit, HostBinding, Input } from '@angular/core';
import { Article } from './article.model';
@Component({
selector: 'app-article',
templateUrl: './article.component.html',
styleUrls: ['./article.component.css'],
})
export class ArticleComponent implements OnInit {
@HostBinding('attr.class') cssClass = 'row';
@Input() article: Article;
constructor() {
// 게시물은 Input 행에 위치함
// 따라서 따로 할 일은 없다.
}
voteUp(): boolean {
this.article.voteUp();
return false; //재랜더링을 막음
}
voteDown(): boolean {
this.article.voteDown();
return false; //재랜더링을 막음
}
ngOnInit() {}
}
Article이라는 클래스를 가져와 article에 할당해서 밑의 함수에서 사용하는 코드이다.
article이 undefined라 Article이라는 타입이 안맞다구 해서
@Inpun() article: Article|undefined;
로 작성해줬더니
article을 사용하고 있는 아래 voteUp(), voteDown함수에서 에러가 나버린다ㅜ
voteUp(): boolean {
if(this.article != undefined){
this.article.voteUp();
}else{}
return false; //재랜더링을 막음
}
그래서 밑에 함수도 article이 들어오면 안의 코드를 실행하고 아니면 걍 암것두 안함~ 이런식으로 해줬더니 에러가 사라졌다 ㅎㅎ
++) 아 ㅜㅜ 위에처럼 했는데 에러남
@Input() article!:Article;
로 변경하면 된다..
!: 연산자는 컴파일러에게 "변수 article은 값이 무조건 할당되어있으므로 걱정 말고 사용하면 된다~ 라고 알려준다고 한다.. 쫭난다 ㅜㅜ
최종 코드는 이러하다~
import { Component, OnInit, HostBinding, Input } from '@angular/core';
import { Article } from './article.model';
@Component({
selector: 'app-article',
templateUrl: './article.component.html',
styleUrls: ['./article.component.css'],
})
export class ArticleComponent implements OnInit {
@HostBinding('attr.class') cssClass = 'row';
@Input() article!: Article;
constructor() {
// 게시물은 Input 행에 위치함
// 따라서 따로 할 일은 없다.
}
voteUp(): boolean {
this.article.voteUp();
return false; //재랜더링을 막음
}
voteDown(): boolean {
this.article.voteDown();
return false; //재랜더링을 막음
}
ngOnInit() {}
}
변수 선언부분에
!:를 넣어주자..
@Input() article!: Article;