오브젝트를 다른 오브젝트에 집어 넣는 방법 각도/자바 스크립트

Question

배열을 다른 배열로 푸시하려고 할 때 앱을 만들고 있습니다. "정의되지 않은 '푸시'속성을 읽을 수 없습니다."라는 오류가 발생합니다.

export var CARDS: any[] = [ 
    { 
     channel: "facebook" 
     date: "2016-01-07" 
     comments: [ 
      { 
       content: "Hey would you look at this card?", 
       user: "John Appleseed", 
       avatar: "url" 
      }, 
      { 
       content: "I like this card!", 
       user: "John Doe", 
       avatar: "url" 
      } 
     ] 
    }, 
    { 
     channel: "facebook" 
     date: "2016-01-07" 
     comments: [ 
      { 
       content: "Hey would you look at this card?", 
       user: "Jane Doe", 
       avatar: "url" 
      } 
     ] 
    }]; 

나는 카드에 댓글을 추가 할 내 응용 프로그램의 옵션이 있습니다

이

는 객체입니다.

newComment = { 
    content: "", 
    user: "", 
    avatar: "" 
    }; 

을 그리고 버튼으로 나는 submitComment 함수를 호출 : : 그러므로 내가 만든

내 HTML은 다음과 같습니다

submitComment(comment) { 
    console.log(this.newComment); 
    this.comment.push(newComment); 
} 

(참고 : 이온 입력을 설명 내가 이온과 함께 일하고 있어요)

<ion-input type="text" placeholder="Type a comment..." [(ngModel)]="newComment.content"></ion-input> 
<button (click)="submitComment(comment)">Send comment</button> 

내 submitComment 함수에서 console.log를 수행하고 올바른 정보를 표시합니다. 그러나 푸시는 작동하지 않습니다. undefined의 'push'속성을 읽을 수 없습니다.라는 오류가 발생합니다. 대괄호 사이에 "this.newComment"를 시도했지만 작동하지 않습니다.

저는 Angular/JS를 알기 시작 했으므로 알아낼 수없는 간단한 내용 일 것입니다. 귀하의 도움에 미리 감사드립니다 :-)

편집 : 추가하는 것을 잊었습니다. * ngFor = "의견을 표시하기 위해"card.comments의 의견을 남기십시오. " 따라서 나는 단지 추가 HTML에서 "주석"을 사용한다.

Answer 1

submitComment 메서드에 제공하는 변수가 comment 인 경우 문제가 발생했습니다. 따라서 어떤 방법 (특히 push)도 호출 할 수 없습니다 ...

그렇지 않으면 CARDS 속성이 올바르게 정의되지 않은 것처럼 보입니다. 다음과 같이 정의하십시오.

CARDS: any [] = [ 
    { 
    channel: "facebook" 
    date: "2016-01-07" 
    comments: [ 
     { 
     content: "Hey would you look at this card?", 
     user: "John Appleseed", 
     avatar: "url" 
     }, 
     { 
     content: "I like this card!", 
     user: "John Doe", 
     avatar: "url" 
     } 
    ] 
    }, 
    { 
    channel: "facebook" 
    date: "2016-01-07" 
    comments: [ 
     { 
     content: "Hey would you look at this card?", 
     user: "Jane Doe", 
     avatar: "url" 
     } 
    ] 
    } 
]; 

Answer 2

Thierry 덕분에 문제가 해결되었습니다. :-) 내 코드에서 약간의 문제를 살펴 봤습니다. 같은 문제가있는 모든 사람들을위한 해결책이 있습니다.

내 문제는 내 클릭 기능으로 얻은 가치 내에있었습니다. 내가 처음에 가지고 있었다

(click)="submitComment(comment)" 

그러나 'comment'는 정의되지 않았다. 내 ngFor = "card.comments의 의견을 통해"정의 하겠지만 내 클릭 기능은 ngFor 외부에 있다고 생각했습니다. 당신은 중복 키가

submitComment(card) { 
    console.log(this.newComment); 
    card.comments.push(this.newComment); 
    }