typescript ngIf- 表达式在检查后发生了变化。以前的值：'ngIf：false'。当前值：'ngIf：true'
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/52069842/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
ngIf- Expression has changed after it was checked. Previous value: 'ngIf: false'. Current value: 'ngIf: true'
提问by sneha mahalank
How to call method from one component to another when it has no parent child relation?
没有父子关系时如何从一个组件调用方法到另一个组件？
I have 2 sibling components and as below:
我有 2 个兄弟组件，如下所示：
header.ts
头文件
private postValues() {
this._PartService.PostDataValues(this.search)
.subscribe(result => {
})
}
part.ts
零件.ts
this._PartService.getMasterData()
.subscribe(result => {
})
In this case I need to call postValues()method into getMasterData()to get some description values, and it has no parent and child communication.
在这种情况下，我需要调用postValues()方法进入getMasterData()来获取一些描述值，并且它没有父子通信。
采纳答案by Ashish Kadam
It's not possible to trigger a sibling component method directly, but there is a way to trigger sibling component event using import { BehaviorSubject } from 'rxjs';
不能直接触发同级组件方法，但是有一种方法可以使用触发同级组件事件 import { BehaviorSubject } from 'rxjs';
I use this approach to pass data to sibling component but it's work as well if you trigger event.
我使用这种方法将数据传递给同级组件，但如果您触发事件，它也能正常工作。
First You Create Service, Service that I call it DataService.ts
首先你创造服务，我称之为服务 DataService.ts
import { Injectable } from '@angular/core';
import { BehaviorSubject } from 'rxjs';
@Injectable()
export class DataService {
private triggerEventMsg = new BehaviorSubject(false);
triggerEvent = this.triggerEventMsg.asObservable();
constructor() { }
triggerEvent(val: boolean) {
this.messageSource.next(message)
}
}
Now One Component Trigger another Component, For now, Com1 trigger Com2 event.
现在一个组件触发另一个组件，现在，Com1 触发 Com2 事件。
Com1 trigger DataService triggerEvent with pass boolean value.
Com1 使用传递布尔值触发 DataService triggerEvent。
Com1.component.ts
Com1.component.ts
import { Component, OnInit } from '@angular/core';
import { DataService } from "../data.service";
@Component({
selector: 'app-com1',
template: `
{{message}}
<button (click)="newMessage()">New Message</button>
`
})
export class Com1 implements OnInit {
constructor(private data: DataService) { }
ngOnInit() {
}
com1ClickEvent() {
this.data.triggerEvent(true);
}
}
Com2 Observe that variable when data change the method trigger in Com2 Component.
Com2 当数据改变 Com2 组件中的方法触发器时观察该变量。
Com2.component.ts
Com2.component.ts
import { Component, OnInit } from '@angular/core';
import { DataService } from "../data.service";
@Component({
selector: 'app-com2',
template: `
<p>Com2</p>
`
})
export class Com2 implements OnInit {
constructor(private data: DataService) { }
ngOnInit() {
this.data.triggerEventMsg.subscribe(message => {
// Do What ever you want.
})
}
}
回答by Mustafa Kunwa
communicate to component which are not parent-child. So I'm communicating it through service
与非父子组件通信。所以我通过服务来传达它
service.ts
服务.ts
value=false;
search: EventEmitter < boolean > = new EventEmitter();
toggle() {
this.value = !this.value;
this.search.emit(this.value);
}
search.ts
搜索.ts
submit():void{
this.service.toggle();
}
Home.ts
主页.ts
ngOnInit() {
this.service.change.subscribe(value => {
//some code here
}
}
回答by Anish Kutti
Another alternative is to add the api call between following
另一种选择是在以下内容之间添加 api 调用
setTimeout(() => {
setTimeout(() => {
//api call goes here
// api 调用到这里
}, 1000);
}, 1000);
回答by Mohammad Hassani
My solution is to use
我的解决方案是使用
ngAfterViewChecked(){
this.cdRef.detectChanges();
}
in the component that you get the error
在您收到错误的组件中
