打字稿:document.getElementById()即使元素已加载也返回null

时间:2019-05-29 14:53:40

标签: javascript html typescript

我有一个名为“ blockButtons”的函数,我在ngOnInit内调用该函数,以请求具有给定id的元素,但我一直为null。为什么会这样呢?加载所有元素后不调用ngOnInit吗?

这是我的代码: HTML:

<div *ngIf="conference">
 <h2 class="text-danger">Sessions:</h2>
  <button type="button" class="btn btn-info" routerLink="/addSession/{{conference.id}}" routerLinkActive="active" id="addSessions">Add Sessions</button>
  <app-scmember-session-list [conferenceId]=conference.id></app-scmember-session-list>

  <h2 class="text-danger">PcMembers:</h2>
  <button type="button" class="btn btn-info" id="addPcMembers" routerLink="/addPcMembers/{{conference.id}}" routerLinkActive="active" >Add PcMembers</button>
  <app-scmember-pcmembers-list [conferenceId]=conference.id></app-scmember-pcmembers-list>

  <br>
  <button (click)="goBack()">Back</button>
  <button (click)="save()">Save</button>
</div>

打字稿:

@Component({
  selector: 'app-scmember-conference-detail',
  templateUrl: './scmember-conference-detail.component.html',
  styleUrls: ['./scmember-conference-detail.component.css']
})
export class ScmemberConferenceDetailComponent implements OnInit {

  @Input() conference: Conference;

  constructor(private conferenceService: ConferenceService,
              private route: ActivatedRoute,
              private location: Location) {
  }

  ngOnInit() {
    this.route.params
      .subscribe((params: Params) => this.conferenceService.getConference(+params['id'])
      .subscribe(conference => {
        this.conference = conference;
        this.blockButtons();
      }));
  }

  goBack(): void {
    this.location.back();
  }

  save(): void {
    this.conferenceService.update(this.conference)
      .subscribe(_ => this.goBack());
  }

  private blockButtons() {
    if(Date.now() > Date.parse(this.conference.callForPapers)){
      (<HTMLButtonElement> document.getElementById("addPcMembers")).disabled = true;
    }
  }
}

0 个答案:

没有答案