这个绑定有什么问题？(Angular2+)

更新3:

实际上我找到了导致我的代码初始问题的原因.如果我使用Ionic/Angular侦听器绑定到我的代码中的按钮 - 然后将变量for false更改为true - 确实会更改UI状态.

但是,如果我使用自定义侦听器('touchstart'),那么即使变量发生变化 - 它也不会导致UI刷新.我认为这是由角度渲染等方式起作用的.但我希望在某处记录下来.

编辑了代码片段+说明在代码片段中我们有父子组件,其中子项的发出事件需要更改父组件可见性.

编辑澄清问题更好:

在我的代码中,我有一个非常简单的组件(下面),我想让这些UI游侠在showSliders变量的布尔状态后动态显示/消失.

我验证了我在变量中获得了更新的值,但我想该视图只会在它呈现的时刻或类似的内容中读取它.

所以我再次看到UI没有显示[hidden] ="showSliders"(showSliders在这里是真的),反之亦然.

但问题是 - 如果页面已经在一个状态下呈现自己,那么动态更改变量不会导致UI出现/消失.

我有一个简单的方法来实现这一目标吗？

在Javascript中,一旦得到布尔值,我可能会得到DIV的ID.style.display ="none".如何在角度2+中做同样的事情？

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { ChildComponent } from '../../components/child/child'

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

  public hidden: boolean = false; 

  constructor(public navCtrl: NavController) {

  }
  toggleButton() {
    this.hidden = !this.hidden;
    console.log(this.hidden);
  }

  getEvent($event) {
    console.log($event);
    this.hidden = $event;
  }
}

// CHILD:

import { Component, Output, EventEmitter } from '@angular/core';

@Component({
  selector: 'child',
  template: 'Hide Toggle (Child)'
})
export class ChildComponent {

  @Output() OnSomeEvent= new EventEmitter();

  boolean: boolean = false;

  constructor() {
    console.log('Hello ChildComponent Component');
  }

  toggleButton() {
    this.onSomeEvent.emit(this.boolean);
    console.log("pressed Child button")
  }

}

// PARENT VIEW:


  
    
      Just playground
    
  



 

  
    
      
      
    
  

  Hide Toggle (Parent)