Angular Inputs View Displays，有什么方法可以快速交换测试输入数据？

Question

如何创建模拟数据以插入和测试显示？每次，我们想要查看 HTML 渲染，都必须将数据复制并粘贴到 Typescript 文件中。是否有任何工具集可以执行此操作？

目前正在测试@Inputs，它们正在 HTML

中显示

在研究以下选项时，

它不是 API，因此无法使用“angular-in-memory-web-api”中的 InMemoryDbService https://www.techiediaries.com/angular-inmemory-web-api/
也不是数据库，所以不能申请json-server https://medium.com/letsboot/the-perfect-mock-backend-to-start-with-an-angular-application-3d751d16614f

有哪些选项可以快速交换输入？还是人们必须复制并粘贴到每个文件中，这是 Angular 中的习惯吗？

打字稿

export class CustomerView implements OnInit {

  @Input() customer: Customer;
    this.customer.name = "Joe";
    this.customer.address = "123 Maple STreet";
    this.customer.city = "Atlanta";
    this.customer.state = "GA";
    this.customer.zip= "30314";
    this.customer.phone = "555-444-77777";

HTML

    <div class = "row">
        <div> {{customer.name}} </div>
        <div> {{customer.address}} </div>
        <div> {{customer.city}} </div>
        <div> {{customer.state}} </div>
        <div> {{customer.zip}} </div>
        <div> {{customer.phone}} </div>
    </div>

Display example plcture

Answer 1

您可以使用必填字段创建 json 文件或对象。

  customerDummy = {
    name: "Joe",
    address: "123 Maple STreet",
    city: "Atlanta",
    state: "GA",
    zip: "30314",
    phone: "555-444-77777",
  }

无论何时创建变量，只需分配值即可。例如

@Input() customer: Customer = customerDummy;

Angular Inputs View Displays，有什么方法可以快速交换测试输入数据？

Angular Inputs View Displays, Any way to Quickly Swap Test Input Data?

javascript

node.js

typescript

angular

angular7