有没有办法在服务器的解析器中打开模态?现在它给了我错误。
RegistroComponent.html:98 ERROR Error: ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: 'true'. Current value: 'false'.
这是代码。
import { Component, OnInit, Input, ViewContainerRef } from '@angular/core';
import { TipoEquipoService } from '../../tipo-equipo/tipo-equipo.service';
import { MarcaService } from '../../marca/marca.service';
import { RangoService } from '../../rango/rango.service';
import { EmpleadoService } from '../../shared/services/empleado.service';
import { EquipoService } from './../equipo.service';
import { ResponsableService } from '../../shared/services/responsable.service';
// Models
import { Equipo } from './../equipo';
import { TipoEquipo } from '../../tipo-equipo/tipo-equipo';
import { Marca } from '../../marca/marca';
import { Rango } from '../../rango/rango';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/debounceTime';
import 'rxjs/add/operator/distinctUntilChanged';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/do';
import 'rxjs/add/operator/switchMap';
import 'rxjs/add/operator/catch';
import 'rxjs/add/observable/of';
import { NgbModal, NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
import { ToastsManager } from 'ng2-toastr/ng2-toastr';
import { ConfirmComponent } from '../../shared/components/confirm/confirm.component';
@Component({
selector: 'app-registro',
templateUrl: './registro.component.html',
providers: [],
styleUrls: ['./registro.component.css']
})
export class RegistroComponent implements OnInit {
tiposEquipo: TipoEquipo[] = [];
marcas: Marca[] = [];
rangos: Rango[] = [];
equipo: Equipo = new Equipo(0, '', '', 0, 0, 0, 0, 0, 0, '', '', '', 1, '', new Date(), '', new Date());
searching = false;
searchFailed = false;
nombreEmp: string;
IdResponsable = {};
closeResult: string;
constructor(private tipEquiSrv: TipoEquipoService,
private marcaSrv: MarcaService,
private rangoSrv: RangoService,
private empleadoSrv: EmpleadoService,
private equipoSrv: EquipoService,
private responsableSrv: ResponsableService,
private modalService: NgbModal,
public toastr: ToastsManager, vcr: ViewContainerRef) {
this.toastr.setRootViewContainerRef(vcr);
}
ngOnInit() {
this.tipEquiSrv.getTipoEquipo().subscribe(tipos => { this.tiposEquipo = tipos; });
this.marcaSrv.getMarcas().subscribe(marcas => this.marcas = marcas);
this.rangoSrv.getRangos().subscribe(rangos => { this.rangos = rangos; });
}
registro() {
console.log(this.equipo);
// this.equipoSrv.addEquipo(this.equipo)
// .subscribe(
// data => console.log(data),
// err => console.log(err),
// () => console.log('Request Completa')
// );
}
search = (text$: Observable<string>) =>
text$
.debounceTime(300)
.distinctUntilChanged()
.do(() => this.searching = true)
.switchMap(term =>
this.empleadoSrv.getEmpleadoLike(term)
.do(() => this.searchFailed = false)
.catch(() => {
this.searchFailed = true;
return Observable.of([]);
}))
.do(() => this.searching = false)
// formatter = (x: { nombre: string }) => x.nombre;
inputFormatter(x) {
return x.empleadoId;
}
resultFormatter(x) {
return x.nombre;
}
onBlurMethod() {
// Consulto la Cedula en Responsables
this.responsableSrv.getResponsableCed(this.IdResponsable['empleadoId'])
.subscribe(responsable => {
console.log(responsable);
if (responsable == null) {
const modalRef = this.modalService.open(ConfirmComponent);
// const modalRef = this.modalService.open(ConfirmComponent);
// modalRef.componentInstance.name = 'El Responsable no Existe, Desea Crearlo?';
// modalRef.componentInstance.titulo = 'Alerta!';
// modalRef.result.then((result) => {
// console.log('result');
// console.log(result);
// }, (reason) => {
// console.log('reason');
// console.log(reason);
// });
}
});
}
public onSelectTypeahead(eventItem) {
this.nombreEmp = eventItem.nombre;
}
}
非常感谢您的合作,我几个小时都无法解决这个问题,我是棱角分明的新人,我在其他论坛上问过,但他们没有给我答案。
答案 0 :(得分:0)
只需添加此行
即可this.renderer.invokeElementMethod(this.elRef.nativeElement.ownerDocument.activeElement, 'blur');
之前
const modalRef = this.modalService.open(ConfirmComponent);
不要忘记添加到构造函数
constructor(private elRef: ElementRef, private renderer: Renderer) {}
所以它应该是这样的
//***Your code ***
constructor(private tipEquiSrv: TipoEquipoService,
private marcaSrv: MarcaService,
private rangoSrv: RangoService,
private empleadoSrv: EmpleadoService,
private equipoSrv: EquipoService,
private responsableSrv: ResponsableService,
private modalService: NgbModal,
public toastr: ToastsManager, vcr: ViewContainerRef,
private elRef: ElementRef,
private renderer: Renderer
) {
this.toastr.setRootViewContainerRef(vcr);
}
//***Your code***
if (responsable == null) {
this.renderer.invokeElementMethod(this.elRef.nativeElement.ownerDocument.activeElement, 'blur');
const modalRef = this.modalService.open(ConfirmComponent);
//***Your code***
模态打开时聚焦输入的问题。我有同样的问题。只有这条没有焦点的线帮助了我。 您可以阅读有关此问题的更多here。