Javascript 角度4-从子组件发出的停止功能

我有一个父组件：

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent {

  funcBoo():void{
    alert("boo");
    //return false - didn't work
  }

}

@Component({
  selector: 'app-child',
  templateUrl: './child.component.html',
  styleUrls: ['./child.component.scss']
})

export class ChildComponent implements OnInit {


  @Output() onArrowClick: EventEmitter<any> = new EventEmitter();


  arrowClicked(){
    this.onArrowClick.emit(null); 
    alert('arrowClicked');
  }

  }

}

以及子组件：

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent {

  funcBoo():void{
    alert("boo");
    //return false - didn't work
  }

}

@Component({
  selector: 'app-child',
  templateUrl: './child.component.html',
  styleUrls: ['./child.component.scss']
})

export class ChildComponent implements OnInit {


  @Output() onArrowClick: EventEmitter<any> = new EventEmitter();


  arrowClicked(){
    this.onArrowClick.emit(null); 
    alert('arrowClicked');
  }

  }

}

@组件({
选择器：“应用程序子项”，
templateUrl:“./child.component.html”，
样式URL:['./child.component.scss']
})
导出类ChildComponent实现OnInit{
@arrowclick上的输出（）：EventEmitter=neweventemitter（）；
箭头单击（）{
this.onArrowClick.emit（null）；
警报（“箭头单击”）；
}
}
}

在父级的html中，我使用子组件 事件“onArrowClick”如下所示：

<app-child (onArrowClick)="funcBoo()"></app-child >

我希望能够阻止子组件中的函数arrowClicked（）继续运行（不会出现“arrowClicked”警报），并阻止父组件中的函数arrowClicked（）继续运行（该警报适用于无法访问子组件的用户） 我尝试了简单的返回false，但没有成功

你能帮我理解吗

---

谢谢

我建议您添加一个

@Input

选项，以便在需要时禁用排放。下面是一个禁用了

选项的示例：

<app-child [disabled]="parentVariableHere" (onArrowClick)="funcBoo()"></app-child >



然后您的子组件将如下所示：

@Component({
  selector: 'app-child',
  templateUrl: './child.component.html',
  styleUrls: ['./child.component.scss']
})

export class ChildComponent implements OnInit {

  @Input() disabled: Boolean = false;
  @Output() onArrowClick: EventEmitter<any> = new EventEmitter();


  arrowClicked(){
    if(!this.disabled) {
      this.onArrowClick.emit(null); 
      alert('arrowClicked');
    }
  }

}

@组件({
选择器：“应用程序子项”，
templateUrl:“./child.component.html”，
样式URL:['./child.component.scss']
})
导出类ChildComponent实现OnInit{
@Input（）已禁用：布尔值=false；
@arrowclick上的输出（）：EventEmitter=neweventemitter（）；
箭头单击（）{
如果（！this.disabled）{
this.onArrowClick.emit（null）；
警报（“箭头单击”）；
}
}
}
不清楚您到底想做什么。添加正确的解释。不确定，但您是否可以将
$event
作为参数传递到按钮，单击并使用preventDefault（）或StoppRopGationRic，我也尝试了，但没有成功