CODEWITHSUNDEEP
cssangularjstwitter-bootstrap
user603007
user603007

Reputation: 11794

how to change stylesheet dynamically in angular?

I am trying to change my bootstrap.css file to change the theme of my app:

$scope.changeStyle = function (style) {
    $scope.myStyle = style + '/bootstrap.min.css';
    $scope.$apply();
}

Mystyle is defined in the html:

<link rel="stylesheet" href="{{myStyle}}">

The question is how to get it working? here is a plunkr reference:http://plnkr.co/edit/t0fZLB?p=preview

Upvotes: 0

Views: 1390

Answers (1)

Jayantha Lal Sirisena
Jayantha Lal Sirisena

Reputation: 21366

Seems like your change event is not fired. You can do like this,

<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownCountry">
            <li ng-repeat="country in data.locations.countries | orderBy:'country'" ng-model="country.Capital">
                <a ng-click="changeStyle(country.Capital)">{{country.country}}</a>
            </li>
 </ul>

See here

Upvotes: 1

Related Questions