2

私はAngularが初めてで、ここで助けを求めているので、ご容赦ください。

templateUrl を使用するカスタム ディレクティブをテストしようとしています。Jasmine、Grunt、および html2js Grunt プラグインを使用しています。http リクエスト/レスポンスをモックしたり、Karma を使用したりしたくありません。

私の目標は、テストの前にテンプレート キャッシュをプリロードし、Angular でディレクティブ html をキャッシュから解決することです。テストを一時的に簡素化するために、html2js によって作成されたファイルから js テンプレートを抽出しました。$compile がテンプレートをテスト html に挿入しない理由がわかりません。これが私のコードです:

beforeEach(inject(function($rootScope, $controller, $compile, $templateCache) {
    isolatedScope = $rootScope.$new();
    testCtrl = $controller('valueGaugeCtrl', {
        $scope: isolatedScope
    });
    $templateCache.put("App/Common/Widgets/ValueGauge.html",
  "<div ng-controller=\"valueGaugeCtrl\">\n" +
  " <div class=\"valueGauge\">\n" +
  "     <h4>{{gaugetype}}:</h4>\n" +
  "     <h2>{{technique[gaugetype]}}</h2>\n" +
  "     <div>\n" +
  "         <button ng-click=\"onPlusClick()\" class=\"btn-default glyphicon glyphicon-plus plusMinusButton\"></button>\n" +
  "         <button ng-click=\"onMinusClick()\" class=\"btn-default glyphicon glyphicon-minus plusMinusButton\"></button>\n" +
  "     </div>\n" +
  " </div>\n" +
  "</div>");
    html = '<value-gauge gaugetype="someType"></value-gauge>';
    vg = angular.element(html);
    linkFn = $compile(vg);

この時点で、vg がテンプレート html に挿入されていることを期待します。代わりに、「class="ng-isolate-scope ng-scope」のみが元の vg に注入されています。

(templateUrl を使用するのではなく) カスタム ディレクティブでテンプレート html インラインを指定すると、$compile は期待どおりに機能し、html を vg に挿入します。

よろしくお願いします。

4

1 に答える 1