Я написал директиву, которая выглядит так (я пропускаю ненужный код):
Шаблон
<div ng-class="{'dir_a' : FoobarCtrl.dirFoo, 'dir_b' : !FoobarCtrl.dirFoo}" ng-transclude></div>
Контроллер
return {
restrict: 'E',
templateUrl: TemplateFileSeeAbove,
scope: {},
replace: true,
transclude: true,
controllerAs: 'FoobarCtrl',
controller: controller,
bindToController: {
dirFoo: '@'
},
// https://stackoverflow.com/questions/30440194/merge-ngclass-attributes-when-replace-true
compile: function compile(tElement, tAttrs) { // jshint ignore:line
tAttrs.ngClass = tAttrs.ngClass.replace(/}\s*{/g, ', ');
}
Я использую это для объединения элементов ng-класса, и в целом это работает отлично.
В моем другом шаблоне я использую директиву со следующими элементами:
<test-directive ng-class="{'classA' : (varA || varB), 'classB' : (!(varA || varB))}">
random code
</test-directive>
даже если скомпилированный код выглядит как файл (я использовал console.log для проверки) - он как-то работает неправильно. Если varA и varB оба TRUE, мой DIV получает оба класса (classA и classB), но он должен получить только первый (classA).
Странно, если я заменю
'classB' : (!(varA || varB))
в
'classB' : (!(true || true))
это работает. Кто-нибудь понял, почему он не примет мои переменные $scope, верно?
Спасибо за любую помощь...
редактировать Это должна быть проблема с функцией компиляции, которую я использую здесь для объединения двух ng-классов в одном и том же элементе. Когда я удаляю ng-класс моей директивы, он работает нормально - может показаться, что директива не может связаться с переменными области видимости.