使用Observable showCancelToolModal
创建了一个模态。当到达指定的浏览器页面时,我收到控制台错误:
下面是HTML:
<!---------------------------------------------------------------------------------------------------------------------------------------->
<!-- Cancel Tool Modal -->
<!---------------------------------------------------------------------------------------------------------------------------------------->
<!-- ko if: this.model.showCancelToolModal() -->
<div class="app-modal modal fade" id="cancelToolModal" tabindex="-1" role="dialog" aria-labelledby="#modaltitle" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" aria-label="Close" data-bind="click: function(){ closeToolWarning(); }"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="modaltitle"><i class="fa fa-edit"></i><label data-bind="text: model.selectedToolVersion()"></label></h4>
</div>
<div class="modal-body">
<div class="app-form teacher-assignment">
<div class="entity-detail classroom border-bottom">
<h3 class="name">
<span class="item-id labeled"><smart-label params="key: 'ObservationClassroomTeacherModalClassroomLabel'"></smart-label></span>
<!-- ko if: !!model.selectedClassroomObservation && !!model.selectedClassroomObservation() -->
<label class="age" data-bind="text: model.selectedClassroomObservation().classroom.name()"></label>
<!-- /ko -->
</h3>
</div>
<div class="form-section">
<div class="instructions">
<label><span data-bind="html: model.observationCancellationDialogBody()"></span></label>
</div>
<div class="validation-line">
<!-- ko if: (!!model.observationCancellation.newClassroomId && !!model.observationCancellation.newClassroomId()) || model.isAdmin() || model.isObservationAdmin() -->
<div class="form-group no-margin inline-validation input-validation">
<label><smart-label-literal params="key:'OrgObservationNewClassroom', defaultText: 'New Classroom'"></smart-label-literal></label>
<select data-bind="options: model.cancelableClassrooms, optionsText: 'name', optionsValue: 'id', value: model.observationCancellation.newClassroomId, optionsCaption: 'Select Eligible Classroom', valueAllowUnset: true"></select>
<i class="fa fa-exclamation-triangle validation-icon"></i>
</div>
<!-- /ko -->
<!-- ko if: (!model.observationCancellation.newClassroomId || !model.observationCancellation.newClassroomId()) && !model.isAdmin() && !model.isObservationAdmin() -->
<div class="form-group no-margin inline-validation input-validation validationElement">
<label><smart-label-literal params="key:'OrgObservationNewClassroom', defaultText: 'New Classroom'"></smart-label-literal></label>
<select data-bind="options: model.cancelableClassrooms, optionsText: 'name', optionsValue: 'id', value: model.observationCancellation.newClassroomId, optionsCaption: 'Select Eligible Classroom', valueAllowUnset: true"></select>
<i class="fa fa-exclamation-triangle validation-icon"></i>
</div>
<!-- /ko -->
</div>
<div class="validation-line">
<!-- ko if: !!model.observationCancellation.cancellationReason && !!model.observationCancellation.cancellationReason() -->
<div class="form-group no-margin inline-validation input-validation">
<label>Cancellation Reason</label>
<textarea class="form-control" data-bind="value: model.observationCancellation.cancellationReason"></textarea>
<i class="fa fa-exclamation-triangle validation-icon"></i>
</div>
<!-- /ko -->
<!-- ko if: !model.observationCancellation.cancellationReason || !model.observationCancellation.cancellationReason() -->
<div class="form-group no-margin inline-validation input-validation validationElement">
<label>Cancellation Reason</label>
<textarea class="form-control" data-bind="value: model.observationCancellation.cancellationReason"></textarea>
<i class="fa fa-exclamation-triangle validation-icon"></i>
</div>
<!-- /ko -->
</div>
</div>
</div>
</div>
<div class="modal-footer">
<div class="row">
<div class="twobutton-col">
<button class="btn primary-btn btn-lg" data-bind="enable: ((!!model.observationCancellation.newClassroomId && !!model.observationCancellation.newClassroomId()) || model.isAdmin() || model.isObservationAdmin()) && !!model.observationCancellation.cancellationReason && !!model.observationCancellation.cancellationReason(), click: function(){ saveCancellation(); }"><smart-label params="key: 'GenericSave'"></smart-label></button>
</div>
<div class="twobutton-col">
<button class="btn btn-gray btn-lg" data-bind="click: function(){ closeToolWarning(); }"><smart-label params="key: 'GenericClose'"></smart-label></button>
</div>
</div>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div>
<!-- /ko -->
下面是相关的视图模型代码:关闭工具警告:
self.closeToolWarning = (): void => {
swal({
title: self.smartlabels.genericCloseWithoutSavingTitle(),
text: self.smartlabels.genericCloseWithoutSubmittingHtml(),
html: true,
type: 'warning',
showCancelButton: true,
confirmButtonText: self.smartlabels.genericYes(),
cancelButtonText: self.smartlabels.genericNo(),
closeOnConfirm: true,
closeOnCancel: true,
}, function (isConfirm) {
if (isConfirm) {
self.model.selectedStatusId(ObservationStatusEnum.Pending);
self.model.selectedObserverId(0);
self.model.selectedObserverTypeId(null);
$('#addToolModal').modal("hide");
$('#cancelToolModal').modal("hide");
this.model.showCancelToolModal(false);
self.setting.showModal(false);
} else {
}
});
};
关于保存工具:
self.onSaveTool = (): void => {
if (self.model.selectedStatusId() == ObservationStatusEnum.Cancelled) {
this.model.showCancelToolModal(true);
$('#cancelToolModal').modal("show");
}
else if (self.model.selectedStatusId() == ObservationStatusEnum.RevisionsRequired) {
$('#addToolModal').modal("hide");
self.noteSettings.observationId(observation.id());
};
self.SaveCancellation:
self.saveCancellation = (): void => {
OrgFactory.Observation.cancelObservation(self.model.observationCancellation, function (data) {
$('#cancelToolModal').modal("hide");
this.model.showCancelToolModal(false);
location.reload();
},
}
删除了尽可能多的代码,以保持简洁,同时仍然显示所有必要的内容。
1条答案
按热度按时间3htmauhk1#
回答我自己的问题。我所要做的就是从HTML中删除"this"。我将Knockout文档与代码中存在的其他if语句进行了比较,发现没有其他ko if语句有"this"。
之后: