Object is possibly 'null' - ошибка. Typescript
Нам необходимо активировать модальное окно с помощью функции в классе, но переменную modal терминал выдает как Object is possibly 'null'. Функция в конце класса - modalAction.
export class PonyBox {
readonly leaderIcon = partyLeaderIcon;
readonly inviteIcon = faUserPlus;
readonly removeIcon = faUserTimes;
readonly cogIcon = faUserCog;
readonly checkIcon = faCheck;
readonly ignoreIcon = faMicrophoneSlash;
readonly hideIcon = faEyeSlash;
readonly starIcon = faStar;
readonly addFriendIcon = faUserPlus;
readonly removeFriendIcon = faUserMinus;
readonly messageIcon = faComment;
isIgnored = isIgnored;
isFriend = isFriend;
removingFriend = false;
@Input() pony?: Pony;
@Output() sendMessage = new EventEmitter<Entity>();
constructor(private model: Model, private game: PonyTownGame) {
}
get ignoredOrHidden() {
return this.pony && (isIgnored(this.pony) || isHidden(this.pony));
}
get isMod() {
return this.model.isMod;
}
get canInviteToParty() {
return this.pony && (!this.game.party || (isPartyLeader(this.game) && !isPonyInParty(this.game.party, this.pony, true)));
}
get canRemoveFromParty() {
return this.pony && isPartyLeader(this.game) && isPonyInParty(this.game.party, this.pony, true);
}
get canPromoteToLeader() {
return this.pony && isPartyLeader(this.game) && isPonyInParty(this.game.party, this.pony, false);
}
get special() {
const tag = getTag(this.pony && this.pony.tag);
return tag && tag.name;
}
get specialClass() {
const tag = getTag(this.pony && this.pony.tag);
return tag && tag.tagClass;
}
get paletteInfo() {
return this.pony && getPaletteInfo(this.pony);
}
inviteToParty() {
this.playerAction(PlayerAction.InviteToParty);
}
removeFromParty() {
this.playerAction(PlayerAction.RemoveFromParty);
}
promoteToLeader() {
this.playerAction(PlayerAction.PromotePartyLeader);
}
toggleIgnore() {
if (this.pony) {
const ignored = isIgnored(this.pony);
this.playerAction(ignored ? PlayerAction.Unignore : PlayerAction.Ignore);
this.pony.playerState = setFlag(this.pony.playerState, EntityPlayerState.Ignored, !ignored);
}
}
hidePlayer(days: number) {
this.playerAction(PlayerAction.HidePlayer, days * DAY);
}
addFriend() {
this.playerAction(PlayerAction.AddFriend);
}
removeFriend() {
this.playerAction(PlayerAction.RemoveFriend);
}
private playerAction(type: PlayerAction, param: any = undefined) {
const ponyId = this.pony && this.pony.id;
if (ponyId) {
this.game.send(server => server.playerAction(ponyId, type, param));
}
}
sendMessageTo() {
if (this.pony) {
this.sendMessage.emit(this.pony);
}
}
// supporter servers
get canInviteToSupporterServers() {
return false; // DEVELOPMENT; // TODO: check if ignored or hidden
}
get isInvitedToSupporterServers() {
return false;
}
inviteToSupporterServers() {
this.playerAction(PlayerAction.InviteToSupporterServers);
}
modalAction() {
let modal = document.getElementById('myModal');
modal.style.display = "block";
}
}
Само модальное окно:
button#myBtn Open Modal
#myModal.modal
.modal-content
.modal-header
span.close ×
h2 Modal Header
.modal-body
iframe(name='myiframe')
p Some text in the Modal Body
p Some other text...
.modal-footer
h3 Modal Footer
Ответы (1 шт):
Автор решения: Aziz Umarov
→ Ссылка
Всё на самом деле просто
element = document.getElementById(id);
Возвращаемое значение
ссылка на объект типа Element соответствующий указанному ID или null
в коде
let modal = document.getElementById('myModal');
modal.style.display = "block";
нет проверки на null
let modal = document.getElementById('myModal');
if (modal) {
modal.style.display = "block";
}