在将数据从子组件传递到父组件时面临问题,

时间:2019-02-04 12:18:59

标签: javascript angular angular5 angular6

我正在尝试的Angular项目中工作-

  

将数据从子组件发送到父组件   我遇到错误时遇到了问题   我已经使用@output指令将子数据传递给父组件   我将错误放在

错误是>>

EventEmitter {_isScalar: false, observers: Array(1), closed: false, isStopped: false, hasError: false, …}
closed: false
hasError: false
isStopped: false
observers: [Subscriber]
thrownError: null
__isAsync: false
_isScalar: false
__proto__: Subject
  

我在下面共享我的代码

子组件ts文件

export class LivematchesComponent implements OnInit {

  matchData:any = [1];
  token:any;
  jsonData: any;

  @Output() contestId:  EventEmitter<any> = new EventEmitter<any>();
    @Input() matchUid: any;
  @Input() matchstatus: any;
  @Input() sportsType: any;


  constructor(private _route: ActivatedRoute , private router: Router  , private rest:ServicesService) { }

  ngOnInit() {
    console.log(this.matchUid);
    console.log(this.matchstatus);
    console.log(this.sportsType);
    this.loaddata();
  }

  loaddata(){

    this.token = 'Bearer ' +  localStorage.getItem('putoken');



    let liveContestsBody = { matchId: this.matchUid, matchStatus: this.matchstatus,};

    this.rest.getLiveContests(liveContestsBody,this.token).then(
      result => {
        this.jsonData = result;
        console.log('Live match data ');
        console.log(this.jsonData);
        console.log('>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>');
        if (this.jsonData.status == '1') {
          this.matchData = this.jsonData.data;
          console.log(this.matchData.contestId);
         } else {
          console.log('No data found');
          }
      },
      err => {
        this.router.navigate(['ErrorPage']);
        console.log('connection failed');
      }
        );
  }

  goToMatchCenter(){
    this.router.navigate(['/matchcenter/cricket/1']);
  }

  goCashContest(contestId) {
    alert('hello');
    //  this.contestId = contestId;
    this.contestId.emit(this.contestId);
     console.log(this.contestId);

     alert('hello');


  }
}

child.html

<div *ngFor="let match of matchData; let i = index" (click)="goCashContest(match.contestId)">
    <h3 style='color:#fff ; text-align: center'> Leader Board </h3>
    <div>
           <div class='mar'>
          <p class='fr'>Winners</p>
          <p style='color:#fff'>{{ match.totalWinners }}</p>
          </div>
</div>

Parent.ts

export class MatchdetailsComponent implements OnInit {
 contestId: any;

constructor(private _route: ActivatedRoute , private router: Router  , private rest:ServicesService) { }

  ngOnInit() {


  }

  goCashContest(contestId:any) {
    alert('hello');
    console.log('contest data >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>');
    console.log(contestId);
    this.contestId = contestId;
    console.log('this');
    console.log(this.contestId);
    alert('go cash contest');
    // this.router.navigate(['/cashcontest' , this.matchUid , contestId , this.sportsType  , this.matchstatus ]);

  }

parent.html

  <app-livematches (contestId)="goCashContest($event)"   [matchUid]='matchUid'  [matchstatus]='matchstatus' [sportsType]='sportsType' > </app-livematches>

0 个答案:

没有答案
相关问题