具有可选输入的Angular2子组件

2019年7月21日 179次阅读

TLDR：@Input可以是可选的吗？

所以我有这个子组件,它是用于创建事务的模式(以银行术语),我想将此模式升级为创建或更新事务.

目前,模态只是一组输入字段和一个用于创建的提交按钮.
我想要实现的是当这个组件将一个事务作为输入时,它将处于’编辑模式’,当它不存在时它将处于’创建模式’​​(意味着输入字段将已经填充了数据)在编辑模式下,在创建模式下为空)

@Input事务可以以某种方式是可选的吗？

最佳答案 是.更重要的是,只需执行此操作以防您需要更改

<div *ngIf="transaction">Some edit stuff</div>
<div *ngIf="!transaction">Create stuff</div>

如果你想要特定的东西

ngOnInit() {
  if(!this.transaction) { 
    // create stuff only 
  } else {
    // update stuff only
  }
}

编辑：我会怎么做(在你的情况下)

这可能不是最好的解决方案,但应该工作(如果我没有得到语法错误)

ngOnInit() {
  if(!this.transaction) { 
    this.transaction = new Transaction();
  } 
}

这样所有类属性都可用,只有空.除非您预先定义它们,否则可以在构造函数或ngOnInit中设置它们.

点赞