kylefang/angular.js
1
0
Fork 0
mirror of https://github.com/zhigang1992/angular.js.git synced 2026-01-12 22:45:52 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(style): expressions in style tags

Browse Source 
Enable data-binding for style tags.

Note: this feature does not work on IE8.

Closes #2387
Closes #6492
This commit is contained in:
Sekib Omazic
2014-02-28 12:39:10 +01:00
committed by Igor Minar
parent 7682e5747a
commit 0609453e1f
2 changed files with 56 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/ng/directive/style.js
View File

@@ -2,5 +2,5 @@
var styleDirective = valueFn({
restrict: 'E',
terminal: true
terminal: false
});

58
test/ng/directive/styleSpec.js
View File

@@ -9,13 +9,65 @@ describe('style', function() {
});
it('should not compile style element', inject(function($compile, $rootScope) {
element = jqLite('<style type="text/css">should {{notBound}}</style>');
it('should compile style element without binding', inject(function($compile, $rootScope) {
element = jqLite('<style type="text/css">.header{font-size:1.5em; h3{font-size:1.5em}}</style>');
$compile(element)($rootScope);
$rootScope.$digest();
// read innerHTML and trim to pass on IE8
expect(trim(element[0].innerHTML)).toBe('should {{notBound}}');
expect(trim(element[0].innerHTML)).toBe('.header{font-size:1.5em; h3{font-size:1.5em}}');
}));
it('should compile style element with one simple bind', inject(function($compile, $rootScope) {
element = jqLite('<style type="text/css">.some-container{ width: {{elementWidth}}px; }</style>');
$compile(element)($rootScope);
$rootScope.$digest();
// read innerHTML and trim to pass on IE8
expect(trim(element[0].innerHTML)).toBe('.some-container{ width: px; }');
$rootScope.$apply(function() {
$rootScope.elementWidth = 200;
});
// read innerHTML and trim to pass on IE8
expect(trim(element[0].innerHTML)).toBe('.some-container{ width: 200px; }');
}));
it('should compile style element with one bind', inject(function($compile, $rootScope) {
element = jqLite('<style type="text/css">.header{ h3 { font-size: {{fontSize}}em }}</style>');
$compile(element)($rootScope);
$rootScope.$digest();
// read innerHTML and trim to pass on IE8
expect(trim(element[0].innerHTML)).toBe('.header{ h3 { font-size: em }}');
$rootScope.$apply(function() {
$rootScope.fontSize = 1.5;
});
// read innerHTML and trim to pass on IE8
expect(trim(element[0].innerHTML)).toBe('.header{ h3 { font-size: 1.5em }}');
}));
it('should compile style element with two binds', inject(function($compile, $rootScope) {
element = jqLite('<style type="text/css">.header{ h3 { font-size: {{fontSize}}{{unit}} }}</style>');
$compile(element)($rootScope);
$rootScope.$digest();
// read innerHTML and trim to pass on IE8
expect(trim(element[0].innerHTML)).toBe('.header{ h3 { font-size: }}');
$rootScope.$apply(function() {
$rootScope.fontSize = 1.5;
$rootScope.unit = 'em';
});
// read innerHTML and trim to pass on IE8
expect(trim(element[0].innerHTML)).toBe('.header{ h3 { font-size: 1.5em }}');
}));