とフィルタ翻訳使用してカルマ/ジャスミンに角度を-翻訳たとえば、私は私のカスタムディレクティブのテンプレートに、角度翻訳使用しています

Question

をテスト：

<!-- directive template --> 
<button>{{"ers.diagramComponent.resizeOriginalButton" | translate}</button> 

この変換値にマップ

マイJSON：

{ 
"ers.diagramComponent.resizeOriginalButton": "Original" 
} 

私はもともと、このエラーを取得しました：を：

Error: [$injector:unpr] Unknown provider: translateFilterProvider <- translateFilter 

私は追加することによって、これを修正

<!-- This is at the top level, runs before all tests --> 
describe("Directive", function() { 

    beforeEach(angular.mock.module("directive")); 

    var mockFilter = function (value: any) { 
     return value; 
    }; 

    beforeEach(function() { 
     angular.mock.module(function ($provide:any) { 
      $provide.value("translateFilter", mockFilter); 
     }); 
    }); 
}); 

ここでは上記のが見つかりました：私は今、取得しようとしています How to mock angular translate filter in unit tests for directives

それは私のカルマ/ジャスミンテストに一致する値を翻訳します。私の失敗のテストは、次のようになります。

var actualSizeHtml = diagramDirective.find("button").html(); 
expect(actualSizeHtml).toEqual("Original"); 

私の失敗テスト：

Expected 'ers.diagramComponent.resizeOriginalButton' to equal 'Original'. 

だから、基本的に私はそれが「オリジナルに等しくなるように「ers.diagramComponent.resizeOriginalButton」を翻訳する方法を見つけ出すことはできません"これはテストが探しているものです。ここで

コンポーネントで$ translateProviderを設定するための私の設定で、リソースフォルダは私のキー/値のペアのためのJSONを保持している：

angular.module("app",["pascalprecht.translate"]).config(["tmhDynamicLocaleProvider", function(tmhDynamicLocaleProvider) { 
    $translateProvider.useStaticFilesLoader({ 
     prefix: "resources/locale-", 
     suffix: ".json" 
    }); 

    $translateProvider.preferredLanguage("en-us"); 
    $translateProvider.useSanitizeValueStrategy("escape"); 
}]); 

しかし、その構成は、私のテストとは何の関係もありません。

Answer 1

あなたのテストでは翻訳フィルタが含まれている "pascalprecht.translate"モジュールについて何も知らないようです。あなたは、「ディレクティブ」モジュールに依存関係として「pascalprecht.translate」モジュールを追加したり、このようsomethigを実行する必要があります。

describe("Directive", function() { 

    beforeEach(angular.mock.module("directive", "pascalprecht.translate")); 

    var mockFilter = function (value: any) { 
     return value; 
    }; 

    beforeEach(function() { 
     angular.mock.module(function ($provide:any) { 
      $provide.value("translateFilter", mockFilter); 
     }); 
    }); 
}); 

また、あなただけの

module("directive", "pascalprecht.translate") 

代わりの

angular.mock.module("directive", "pascalprecht.translate") 

を書くことができます