具有可选输入的 Angular2 子组件

Question

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

所以我有这个子组件，它是创建交易的模式（以银行术语），我想将此模式升级为创建或更新交易。

目前模态只是一组输入字段和一个用于创建的提交按钮。 我想要实现的是，当该组件将事务作为输入时，它将处于“编辑模式”，而当它没有时，它将处于“创建模式”（意味着输入字段将已填充数据在编辑模式下，在创建模式下为空）

@Input transaction 可以是可选的吗？

Answer 1

是的。更重要的是，如果您需要更改，只需执行此操作

<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 中设置它们。