0

我使用Angular2搜索组件之间的通信我尝试在这种模式下但不起作用

模板 variantpages.component.html 内容

<button (click)="changetext()">Change</button> 
<child></child>



@Component({
  selector: 'menu-left',
  templateUrl: './app/pages/variantpages.component.html'
})

export class AppComponent{


child = new ChildComponent();


 changetext(){ this.child.changetext2()}

}
@Component({
   selector: 'child',
   template: `<p>page of {{ pageCount }}</p>`
})

export class ChildComponent{

@Input() photo:string = "ciao ciao";

@Output() valueChange = new EventEmitter();


pageCount:number;
constructor(){ this.pageCount = 0; }

changetext2(){
        this.pageCount++;
        this.valueChange.emit(this.pageCount);
        console.log(this.pageCount);
  }
}

所以控制台日志显示增量数,但 pageCount 保持为 0

谢谢

4

1 回答 1

0

好的,我用 EventEmitter 解决了,但这仅适用于父母和孩子,现在我的问题不同了,如果我有两个不同的组件,我想用组件 A 中的一个按钮(单击)来更改组件 B 中的字符串,我打电话这个方法setName

组件 A

constructor(private appComponent: AppComponent ){ }
setName(newName: string) {
        this.appComponent.name = newName;
        console.log(this.name);
      }

组分 B

@Input() name: string = "Angular3"

控制台显示新字符串,但名称不变

于 2017-04-13T12:18:27.120 回答