angular.js的新功能,无法弄清楚如何使用templateUrl和隔离范围编写指令测试.
这是我的控制器
(function(){
angular.module('buttons')
.controller('buttonController', ['$scope', function($scope){
//primary button
$scope.primaryButton = { name: 'Submit'};
})();
Run Code Online (Sandbox Code Playgroud)
这是我的观点index.html&
<div class="layoutLeft">
<p>Primary Button</p>
<primary-button info="primaryButton"></primary-button>
</div>
Run Code Online (Sandbox Code Playgroud)
初级button.html
<button class="{{buttonInfo.class}}">{{buttonInfo.name}}</button>
Run Code Online (Sandbox Code Playgroud)
这是我的指示
(function(){
angular.module('buttons')
.directive('primaryButton', function() {
return {
restrict: 'EA',
scope: {
buttonInfo: '=info'
},
templateUrl: 'scripts/local/views/primary-button.html'
}
})
})();
Run Code Online (Sandbox Code Playgroud)
这是我的测试
(function(){
beforeEach(angular.mock.module('buttons'));
describe('Buttons Directive Test', function(){
var $compile, $scope, $httpBackend;
beforeEach(module('templates'));
beforeEach(inject(function(_$compile_, _$rootScope_) {
$compile = _$compile_;
$scope = _$rootScope_.$new();
$scope.primaryButton = {name: 'Save'};
elm = angular.element("<primary-button info='buttonInfo'></primary-button>");
e = $compile(elm)($scope);
e.digest();
})); …Run Code Online (Sandbox Code Playgroud)