angualrjs 自定義css異步加載指令

html中調用：

<!-- 異步加載css文件 -->
<load-css href="css/demo.css"></load-css>

 js代碼：

/**
 * 將對應路徑的css插入html頁面中
 */
app.directive('loadCss', function() {
    return {
        require: '?ngModel',
        restrict: 'E',  
        link: function ($scope, element, attrs, ngModel) {
            $("<link />")
            .prop("href", attrs.href)
            .prop("type", "text/css")
            .prop("rel", "stylesheet")
            .appendTo("head");
        }  
    }
});

 

 

歡迎加入，Java，前端的共同窗習【愛問共享編程部落】 479668591