0

我试图让我的头在目前的测试指令中遇到一些奇怪的行为。我的代码如下:测试指令时'@'和'='之间的区别

angular.module('tddApp', []) 

.directive('oddsButton', function() { 
    return { 
     template: '<div class="odds-btn"></div>', 
     replace: true, 
     scope: { 
      market1: '=', 
      market2: '@' 
     } 
    }; 
}); 

describe('Odds Button Directive Test Suite', function() { 
    var $scope, 
     scope, 
     elem, 
     html; 

    beforeEach(module('tddApp')); 

    beforeEach(function() { 
     html = '<div odds-button market1="market" market2="market"></div>'; 

     inject(function($compile, $rootScope) { 
      $scope = $rootScope.$new(); 
      $scope.market = '2/1'; 
      elem = angular.element(html); 
      $compile(elem)($scope); 
      scope = elem.isolateScope(); 
      scope.$apply(); 
     }); 

    }); 

    it('should be created and replace html', function() { 
     expect(elem[0].className).toContain('odds-btn'); 
    }); 

    it('should have market in isolate scope', function() { 
     expect(scope.market1).toBe('2/1'); 
     expect(scope.market2).toBe('2/1'); 
    }); 
}); 

当我在市场上通过使用2路结合“=”一切正常的分离范围,但是当我通过为只读“@”它得到的字符串“市场'而不是父范围值。

http://jsfiddle.net/6dcpo9ad/

任何想法非常赞赏

Ç

回答

1

当你通过它“@”这真的只是要读的属性传递的值。它不会试图解决它背后的变量。

所以你需要通过{{}}模式来告诉角度来解决变量的值。

的HTML改成这样:

html = '<div odds-button market1="market" market2="{{market}}"></div>'; 

这对我的作品呢。

+1

你是对的,当然。笨! – Cathal 2014-10-08 14:41:27

相关问题