All geek questions in one place

Strange ng class behavior

I play with angular and have encountered strange directive behavior ng-class. Here is my application template:

<body ng-app>
  {{ isSidebarExpanded }}
  <div ui-view="sidebar" ng-class="{true:'expanded', false:'collapsed'}[isSidebarExpanded]"></div>
</body>

And now - when I change isSidebarExpandedin my controller, the first line shows its contents (which is true / false) without any problems, but using it in ng-classcauses:

TypeError: undefined is not a function

I can say that this is a mistake ng-class, when I delete a part, it gives this error. I am not sure which part of my code will be useful here because it seems to me very confusing.

+4
source share
1 answer

, ng-class-alt, . , app - angular.

app.directive('ngClassAlt', function() {
  return {
    restrict: 'A',
    scope: {
      ngClassAlt: '=ngClassAlt'
    },
    link: function(scope, elm, attrs) {
      scope.$watch('ngClassAlt', function (newVal) {
        _.each(scope.ngClassAlt, function(val, key) {
          if(val)
            elm.addClass(key);
          else
            elm.removeClass(key);
        });
      }, true);
    }
  };
});

AngularJS ... , .

0

Source: https://habr.com/ru/post/1537338/

More articles:


All Articles