$バリデータを使用してType - AngularJS + TypeScriptのバリデーションにインデックスシグネチャがありません

Question

AngularJS 1.5とTypeScript 1.7を使用してディレクティブを作成しようとしています。

I've followed this exampleが、活字体は私が$バリデータをチェックしましたし、それが署名以下に、型IModelValidatorsのだng.INgModelController

interface IOneItemRequiredValidator extends ng.INgModelController { 
    $validators: { 
     oneItemRequired(modelValue: any, viewValue: any) : boolean; 
    }; 
} 

を拡張する際に「型シグネチャがタイプに欠けている」私を与える：

を

interface IModelValidators { 
    [index: string]: (modelValue: any, viewValue: any) => boolean; 
} 

私はそれに従いましたが、今はTypeScriptが複雑ではありませんが、$ validatorsオブジェクトの新しいプロパティにアクセスしようとすると、それを見つけることができません。

interface IOneItemRequiredValidator extends ng.INgModelController { 
    $validators: { 
     [oneItemRequired: string]: (modelValue: any, viewValue: any) => boolean; 
    }; 
} 


angular 
    .module('app') 
    .directive('oneItemRequired',() => { 
     return { 
      restrict: 'A', 
      require: 'ngModel', 
      link: (scope: ng.IScope, element: ng.IAugmentedJQuery, attributes: ng.IAttributes, controller: IOneItemRequiredValidator) => { 
       controller.$validators.oneItemRequired = (modelValue, viewValue) => { 
         return viewValue !== null && viewValue !== undefined && viewValue.length > 0; 
        } 
       } 
      }; 
     }); 

私が間違って私の新しいIOneItemRequiredValidatorインターフェイスを宣言していますか？ありがとう！

Answer 1

TypeScriptではAngular 1を使用しませんが、一般的に言えば、TypeScriptでは、あなたが指定した名前はまったく違いはありません。インターフェイスに名前が付けられていない追加のプロパティを受け入れると言っているだけです。

これは、実際のAngular宣言ファイルが、このビットをIModelValidators宣言に追加したはずであることを意味します。詳細は、hereを参照してください。

これまでの問題点は、単一の機能を持つオブジェクトのタイプがタイプと互換性がないということです。

次の2つの方法のいずれかでそれを修正することができます

（1）だけでインデクサを戻す、のように：

interface IOneItemRequiredValidator extends INgModelController { 
    $validators: { 
     oneItemRequired(modelValue : any, viewValue : any) : boolean; 
     [otherProps: string]: (modelValue: any, viewValue: any) => boolean; 
    }; 
} 

A simple non-Angular example

（2）のように、手動でインターフェイスを拡張：

interface IOneItemRequiredNgModelValidators 
    extends ng.IModelValidators { 
     oneItemRequired(modelValue : any, viewValue : any) : boolean;  
    } 

interface IOneItemRequiredValidator extends ng.INgModelController { 
    $validators: IOneItemRequiredNgModelValidators 
} 

A simple non-Angular example

この最初のコードは、ちょっとしたハッキーを除いて、実際にツールを提供することを目的とするコードが少なくなっています。 2番目は涼しいと感じますが、それはツールのためのものです。だから、私はあなたを選ぶことを許可します:)

彼らはあなたのために働くかどうか教えてください。遊び場の例を、このような総合的な答えを置くために時間を取って、追加するための

乾杯、