Как динамически изменять стили в angular 1.x?

Question

[Максим]

Angular 1.5
Проект не совсем маленький, поэтому опишу саму суть задачи, которую пытаюсь решить

<!--В этом компоненте изменить нужно цвет ссылки, цвет передается с бэка-->
<div class="channels_header header_inner MediumLight cancelDelete">
    <a href="" ng-click='headerLeftButton()' class="channels_info cancelDelete"><p>{{ left_btn }}</p></a>
</div>

Есть компонент, который подвязан под другой template, но в нем мы получаем информацию о цвете data.response.elements_color

'use strict';

angular
    .module('buzz')
    .component('centerHeaderBlock', {
        selector: 'hero',
        templateUrl: "/views/headerCenter.html",
        controller: function ($scope, $rootScope, $location, $translate, $timeout, channelApiService, bgImageService) {

            bgImageService.setScopeObject($scope);

            $scope.first_name = localStorage.getItem('first_name');
            $scope.last_name = localStorage.getItem('last_name');


            // CHANNEL INFO
            function channelInfo(channel_id) {
                channelApiService.setChannelId(channel_id);
                channelApiService.channelGetOne(function (data) {
                    $scope.channel_name = data.response.name;

                    // Set background image, elements color, canvas color
                    bgImageService.setBgImage(data.response.image);
                    bgImageService.setCanvasColor(data.response.canvas_color);
                    // bgImageService.setElementsColor(data.response.elements_color);

                    bgImageService.confirmbgImg();

                });
            }


            // CENTER BUTTON HEADER TRANSLATE
            function centerButtonTranslate () {
                if ($location.path() == '/channelNew') {
                    $timeout(function () {
                        $scope.center_btn = $translate.instant('NEW_CHANNELS_SELECT_COMM');
                    }, 100)

                } else if ($location.path().search(/channel\/\d+/) !== -1) {
                    $timeout(function () {
                        $scope.center_btn = $translate.instant('CHANNEL_SETTINGS_HEADER');
                    }, 100)
                }
            }


            // HIDE USERNAME
            function hideUsername() {

                if ($location.path() == '/message') {
                    $scope.hideUsername = true;
                    $scope.hideChannelName = true;

                } else if ($location.path().search(/messagesList\/\d+/) !== -1) {
                    var channel_id = $location.path().replace(/[^0-9]/gim, '');
                    channelInfo(channel_id);

                    // Set background image

                    $scope.hideUsername = true;
                    $scope.hideChannelName = false;
                    $scope.centerButton = false;

                } else {
                    $scope.hideUsername = false;
                    $scope.hideChannelName = true;
                    $scope.centerButton = false;

                    console.log('Works');

                    // Set default background color
                    bgImageService.setDefaultColor();

                    // Set default elements color
                    bgImageService.setDefaultElementsColor();
                }
            }

            hideUsername();

            $rootScope.$on('$locationChangeStart', function () {
                hideUsername()
            });


        }
    });

Есть сервис, который изменяет цвета

(function () {
    'use strict';

    angular
        .module('buzz')
        .service('bgImageService', bgImageService);


    function bgImageService($timeout) {


        var _bgImage = '';
        var _canvasColor = '';
        var _elementsColor = '';
        var _scopeObject = '';


        return {
            setScopeObject: function (scpObj) {
                _scopeObject = scpObj;
            },
            getScopeObject: function () {
                return _scopeObject
            },

            setBgImage: function (img) {
                _bgImage = img;
            },
            getBgImage: function () {
                return _bgImage
            },

            setCanvasColor: function (canvas_color) {
                _canvasColor = canvas_color;
            },
            getCanvasColor: function () {
                return _canvasColor
            },

            setElementsColor: function (elements_color) {
                _elementsColor = elements_color;
            },
            getElementsColor: function () {
                return _elementsColor
            },

            setDefaultColor: function () {
                $('.bodyColor').css({
                    background: '#f2f2f2'
                })
            },

          

            confirmbgImg: function ($scope) {

                // Set image
                $('.bg-image_static div').css({
						background: 'url(' + this.getBgImage() + ')repeat-x center center fixed',
						backgroundSize: 'cover'
					});

                // Set canvas color
                $('body').css({
                    background: this.getCanvasColor()
                });

                // Set header canvas color
                $('.header_substrate').css({
                    'background-color': this.getCanvasColor(),
                    // 'background-image': 'radial-gradient(rgba(0,0,0, 0.0) 0%, rgba(64,64,64,0.1) 0%)'
                });

                // Set elements color
                var elementsColor = this.getElementsColor();

                // For the 'a' attribute
                this.getScopeObject().headerElementsColor = {
                        color: 'blue'
                    };

                // this.getScopeObject().elementsColor = ['changedAStyle'];


                // $('a').css({
                //     color: elementsColor,
                //     'text-decoration': 'none'
                // });
                //
                // $('a').hover(function () {
                //     $(this).css('color', elementsColor)
                // });
                //
                // $('a').hover(function () {
                //     $(this).css('text-decoration', 'none')
                // });
                //
                // $('a').focus(function () {
                //     $(this).css('color', elementsColor)
                // });
                //
                // $('a').focus(function () {
                //     $(this).css('text-decoration', 'none')
                // });

                // For the '.bodyElementsColor' class
                $('.bodyElementsColor').css({
                    color: elementsColor,
                    'text-decoration': 'none'
                });

                $('.MediumLight').hover(function () {
                    $(this).css('color', elementsColor)
                });

                $('.MediumLight').hover(function () {
                    $(this).css('text-decoration', 'none')
                });

                $('.MediumLight').focus(function () {
                    $(this).css('color', elementsColor)
                });

                $('.MediumLight').focus(function () {
                    $(this).css('text-decoration', 'none')
                });

                // SVG Elements
                $timeout(function () {

                    var svgDOC = document.querySelectorAll('.svgImage');
                    svgDOC.forEach(function (entry) {
                        entry.getSVGDocument().getElementById("svgStyle").style.stroke = elementsColor;

                        if (entry.getSVGDocument() !== null) {
                            if (entry.getSVGDocument().getElementById("svgStyle2") !== null) {
                                entry.getSVGDocument().getElementById("svgStyle2").style.stroke = elementsColor;
                            }
                        }
                    })

                }, 100);


            }
        }
    }

})();

Код стилей для ссылок задан глобально

a
	text-decoration: none
	color: $elements_color
	&:hover
		text-decoration: none
		color: $elements_color
	&:focus
		text-decoration: none
		color: $elements_color

В реализации, которую я написал в сервисе, все работает с погрешностями, разная скорость перекрашивания элементов, так же здесь есть перекрашивание .svg, которое так же красит с разной скоростью.

Пробовал использовать ng-class, ng-style, так как мне нужны динамические изменения, то остается ng-style.
Вопрос, как реализовать через ng-style или есть другие решения этой проблемы?