複数のビューモデルで使用されるインタフェースを宣言する方法

Question

Aurelia & Typescriptを使い始めたばかりで、ベストプラクティスに関するアドバイスを探しています。

products.html

<template> 
    <require from="./product-card"></require> 

    // ... 

    <div repeat.for="product of products" class="product-cards"> 
     <product-card product.bind="product"></product-card> 
    </div> 

    // ... 
</template> 

products.ts

export class Products { 
    public products: Product[] = [ 
     { 
      name: 'Salt', 
      price: 10 
     },{ 
      name: 'Orange Juice', 
      price: 12 
     } 
    ]; 
} 

：ここでは基本的に詳細な product-cardビューで構成され、親 productsビューに分かれた製品のリストを記述する基本コードです

product-card.html

<template> 
    Name: ${product.name} 
    Price: ${product.price} 
</template> 

製品-card.ts

import {bindable} from 'aurelia-framework'; 

export class ProductCard { 
    @bindable product: Product; 
} 

すべてのそれらのファイルが同じディレクトリにあるとproduct.ts & product-card.tsに使用されているProductインタフェースは

export interface Product { 
    name: string; 
    price: number; 
} 

...と同じくらい簡単です

これは基本的には、products.tsでもでもは、上記のコードと実際にはProductインターフェイスを認識しています。ここで

は、私はこの解決したと思います方法は次のとおりです。

• は、他のすべてのファイルと同じフォルダに専用の定義ファイルproduct.d.tsを作成し
• インポート定義products.ts内のファイルだけでなく、product-card.tsには、使用してimport {Product} from './product';

良い/ベストプラクティスと考えられる複数のビューモデルで共有される単純なインターフェイス用の専用定義ファイルを作成しています。これを解決する他の方法は？また、*.d.tsをソースと同じフォルダ内に置くこともOKですか？これは別の場所にあるべきですか？

Answer 1

AureliaはMVVM（Model-View-ViewModel）デザインパターンの使用を推奨しています。

• products.htmlはあなたのビュー
• products.tsであるあなたのViewModel
• product.d.tsですつ以上のViewModelに

で使用/含めることができる、あなたのモデルであります私はproduct-model.tsを呼び出すことを好むが、名前はあなたとある。 サーバーや場合によってはビジネスロジックにリクエストを行うサービスクラス（例：product-service.js）を作成する必要があります。この場合、このサービスクラスにモデルを含めることができます。あなたはViewModelに、「製品・カードを作成する必要はありません。この例ではhttps://blog.ashleygrant.com/2016/04/19/suggestions-for-structuring-a-large-aurelia-application/

：

（ファイル内の共通プットつ以上のクラス活字体で）あなたは、この偉大なブログでプロジェクト構造のためのより多くのヒントを見ることができます.ts "の場合は、ビューのみを作成することができます。http://aurelia.io/hub.html#/doc/article/aurelia/templating/latest/templating-custom-elements/1

はい、OKです。別のファイルと同じフォルダにモデルを入れてください。