UI-Router 0.2.7 does NOT remove view elm styles
HTML
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.9/angular.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.7/release/angular-ui-router.min.js"></script>
<div data-container>
<div data-ui-view="base" id="view-base"></div>
</div>
<script type="text/ng-template" id="/base.html">
<ol>
<li>Testing…</li>
<li>1,2,3</li>
</ol>
</script>
CSS
#view-base {
background-color: red;
padding: 1em;
}
JavaScript
var app = angular.module('MyApp', ['ui.router']);
app.config([
'$stateProvider',
function appConfig( $stateProvider ) {
$stateProvider
.state({ name: 'top', url: '', template: '<div ui-view></div>' })
.state({ name: 'top.nest', url: 'nest', templateUrl: '/base.html' });
}
]);
app.directive('container', [function containerDirective() {
return {
restrict: 'A',
link: function containerDirectivePostLink(scope, element) {
console.log('ContainerDirective');
scope.$on('$stateChangeStart', function setSize() {
console.log('setSize Fn()');
element.children()
.height(400)
.width(400);
});
}
};
}]);