未通過ng-href動態加載CSS文件

我試圖使用ng-href動態加載不同的css樣式到我的頁面中，但頁面沒有使用激活的樣式進行更新。代碼如下：未通過ng-href動態加載CSS文件

<html ng-app="myapp" ng-controller="myController as myctrl"> 
    <head> 
     <link rel="stylesheet" ng-href="../assets/css/{{ myctrl.style }}.css"> 
    </head> 
</html>

在我的控制，我做到以下幾點：

vm.style = "redStyle"; 
pub.subscribe('style', function(theStyle) { 
    vm.style = theStyle; 
});

變量在subscribe與新的風格一旦發佈已經發生更新。但是相應的css文件未被加載，因此樣式在頁面上更新。任何想法我錯過了什麼？

來源

2017-07-28 YourReflection

有兩個// – Vivz

你能在開發檢查。控制檯，如果它返回一個「404 - 找不到文件」？ – Jordumus

對不起，額外的「/」是一個錯字。 – YourReflection

Here is a working demo

這是非常一樣的，你有什麼，所以這是別的東西在你的代碼。很難說，除非你把所有的代碼。

假設樣式表實際上確實存在，而且款式變量得到更新，然後我的猜測是，罪魁禍首是

pub.subscribe()

如果這個回調是由一些角度則角外被觸發不會看到更新變量。你可以把它放回角度空間，像這樣：

pub.subscribe('style', function (theStyle) { 
    $scope.$apply(function(){ 
     vm.style= theStyle; 
    });    
});

來源

2017-07-28 12:24:19

試試這個：

<link rel="stylesheet" data-ng-if="myctrl.style" data-ng-href="../assets/css/{{ myctrl.style }}.css" />

來源

2017-07-28 12:28:46

我解決了不同的看法。在我的HTML，我給的鏈接元素的ID：

<link id="theme" rel="stylesheet" ng-href="../assets/css/{{theme}}.css">

和Controller我說：

var myTheme = document.getElementById("theme"); 
var path = "../assets/css/{{theme}}.css"; 
myTheme.href = path.replace("{theme}", theme.class);

來源

2017-07-31 13:36:44 YourReflection

未通過ng-href動態加載CSS文件

回答

相關問題