AngularCSS 的引入： CSS On-Demand for AngularJS

1) Include the required JavaScript libraries in your

index.html

(ngRoute and UI Router are optional). 引入

<script src="/libs/angularjs/1.5.6/angular.min.js"></script>
<script src="/libs/angularjs/1.5.6/angular-routes.min.js"></script>
<script src="/libs/angular-css/angular-css.min.js"></script>

You can download AngularCSS from GitHub. Also available via Bower and CDN.2. Add

angularCSS

as a dependency for your app. 配置

var myApp = angular.module('myApp', ['ngRoute','angularCSS']);

3.Examples

In Components

myApp.component('myComponent', {
css: 'my-component/my-component.css' // <--- magic!
templateUrl: 'my-component/my-component.html',
});

In Directives

myApp.directive('myDirective', function () {
return {
restrict: 'E',
templateUrl: 'my-directive/my-directive.html',
/* Binding css to directives */
css: 'my-directive/my-directive.css'
}
});

In Controllers

myApp.controller('pageCtrl', function ($scope, $css) {

// Binds stylesheet(s) to scope create/destroy events (recommended over add/remove)
$css.bind({
href: 'my-page/my-page.css'  // 该路径为文件所在路径
}, $scope);

// Simply add stylesheet(s)
$css.add('my-page/my-page.css');

// Simply remove stylesheet(s)
$css.remove(['my-page/my-page.css','my-page/my-page2.css']);

// Remove all stylesheets
$css.removeAll();

});

For Routes (Angular's ngRoute)

Requires ngRoute as a dependency

myApp.config(function($routeProvider) {

$routeProvider
.when('/page1', {
templateUrl: 'page1/page1.html',
controller: 'page1Ctrl',
/* Now you can bind css to routes */
css: 'page1/page1.css'
})
.when('/page2', {
templateUrl: 'page2/page2.html',
controller: 'page2Ctrl',
/* You can also enable features like bust cache, persist and preload */
css: {
href: 'page2/page2.css',
bustCache: true
}
})
.when('/page3', {
templateUrl: 'page3/page3.html',
controller: 'page3Ctrl',
/* This is how you can include multiple stylesheets */
css: ['page3/page3.css','page3/page3-2.css']
})
.when('/page4', {
templateUrl: 'page4/page4.html',
controller: 'page4Ctrl',
css: [
{
href: 'page4/page4.css',
persist: true
}, {
href: 'page4/page4.mobile.css',
/* Media Query support via window.matchMedia API
* This will only add the stylesheet if the breakpoint matches */
media: 'screen and (max-width : 768px)'
}, {
href: 'page4/page4.print.css',
media: 'print'
}
]
});

});

相关链接参考：
https://github.com/castillo-io/angular-css（github源码） http://door3.com/insights/introducing-angularcss-css-demand-angularjs#.V-CKT5FJIdZ(Introducing AngularCSS: CSS On-Demand for AngularJS)
http://www.ituring.com.cn/tupubarticle/1385（第 11 章　AngularJS模块加载）