2016-03-18 28 views
-1

Bir yönerge için bir birim testi yazmaya ve aşağıdaki hatayı almaya çalışıyorum.Açısal yönerge için birim testi

bulamıyor değişkeni: $ derlemek

HTML

<html ng-app="plunker"> 

<head> 
    <meta charset="utf-8"> 
    <title>AngularJS Plunker</title> 
    <link rel="stylesheet" href="style.css"> 
    <script> 
    document.write("<base href=\"" + document.location + "\" />"); 
    </script> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js"></script> 
    <script src="app.js"></script> 
</head> 

<body> 
    Align number to right 
    <br/> 
    <mi-format-number-in-grid numbervalue="11.7866" scale="1">11.097866</mi-format-number-in-grid> 
    <br/> 
    <mi-format-number-in-grid numbervalue="11.097866"></mi-format-number-in-grid> 
    <br/> 
    <mi-format-number-in-grid numbervalue="11.097866"></mi-format-number-in-grid> 
    <br/> 
    <mi-format-number-in-grid numbervalue="11.097866"></mi-format-number-in-grid> 
    <br/> 
</body> 

</html> 

JS

var app = angular.module('plunker', []); 

app.directive('miFormatNumberInGrid', function($compile) { 
    return { 
     restrict: 'E', 
     scope: false, 
     link: function(scope, element, attributes) { 
     var digit = 0; 
     var cssClass = ""; 
     var pctValue = parseFloat(attributes.numbervalue); 
     var scale = parseInt(attributes.scale); 
     if (attributes.percentchar === "true") 
      cssClass = "class='mi-percentsuffix'"; 
     if (!isNaN(scale)) 
      digit = scale; 
     if (isNaN(pctValue)) 
      pctValue = 0; 
     var containerDOM = angular.element("<span style='" + "float:right;' " + cssClass + ">{{" + pctValue + "|number:" + digit + "}}</span>"); 
     var compiled = $compile(containerDOM)(scope); 
     angular.element(element).replaceWith(compiled); 
     } 
    }; 
}); 


describe('directive: mi-format-number-in-grid', function() { 
    // initialize 
    var $compiler, 
     $rootScope; 

    beforeEach(angular.mock.module('cgApp')); 
    beforeEach(inject(function ($compile, $rootScope) { 
     $compile = $compile; 
     $rootScope = $rootScope; 
    })); 

    it("should have 2 digits after decimal", function() { 
     var element = $compile('<mi-format-number-in-grid numbervalue="11.97342" scale="2"></mi-format-number-in-grid>')($rootScope); 
     $rootScope.$digest(); 
     expect(element.html()).toContain("11.97"); 
    }); 
}); 

cevap

1

Çünkü $compile değişken değil var bildirildi, daha doğrusu $compiler bildirdiniz, aynı için $compiler kullanabilirsiniz.

beforeEach(inject(function ($compile, $rootScope) { 
    $compiler = $compile; //it should be $compiler 
    $rootScope = $rootScope; 
})); 

Sonra Aksine seni $compile için $compiler adlandırmak ve ardından aşağıdaki gibi beforeEach bölüm bağımlılık enjeksiyon kısmını değiştirmek yapmak öneririm


var element = $compiler('<mi-format-number-in-grid numbervalue="11.97342" scale="2"></mi-format-number-in-grid>')($rootScope); 

yok.

// initialize 
var $compile, 
    $rootScope; 

beforeEach(angular.mock.module('cgApp')); 

beforeEach(inject(function (_$compile_, _$rootScope_) { 
    $compile = _$compile_; //it should be $compiler 
    $rootScope = _$rootScope_; 
})); 
+0

Saçma sapan hatama dikkat ettiğiniz için teşekkür ederiz. Artık referans almama rağmen testim hala başarısız. – user360

+0

it ("Sayı doğru hizalanmalı", function() { var öğe = ' '; element = ngCompile (öğe) (kapsam); kapsamı. $ digest(); var span = element.find (' span '); var floatRight = element.attr ('style'); bekliyor (span) .toBeDefined(); bekliyor (floatRight) .toBe ("float: sağ"); }); Hata ayıklama modunda span gördüğümde boş. – user360

+0

Aynı şekilde plunkr oluşturursunuz. –