Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

AngularSlideables does not work on div with generated html (ng-bind-html) #6

Open
Legchewer opened this issue Apr 9, 2014 · 2 comments

Comments

@Legchewer
Copy link

I was trying to get it working on a div which loads in content with html tags, but as long as there is an ng-bind-html attribute on the .slideable element it does not work.

The error given is "Uncaught TypeError: Cannot read property 'style' of null", when trying to log the content variable, you get "null".

AngularSlideables does work with html tags in the div and it works when I remove ng-bind-html (which is not an option for me).

Code example:

<ul class="list list-slideout small-12 columns">
            <li ng-repeat="tip in tips_list">
                <h2 slide-toggle="#tip-content-{{tip.id}}">{{ tip.title }}</h2>
                <div id="tip-content-{{tip.id}}" class="list-item-content slideable" ng-bind-html="tip.body">
                    {{ tip.body }}
                </div>
            </li>
</ul>
@select
Copy link

select commented Aug 20, 2015

I discovered the same problem, it is because .directive('slideable', calls var contents = element.html(); but element is in this case an array.

@select
Copy link

select commented Sep 7, 2015

I ended up using this code

app.directive('slideToggle', function() {
  'use strict';
  return {
    restrict: 'A',
    scope: {
      isOpen: '=slideToggle' // 'data-slide-toggle' in our html
    },
    link: function(scope, element, attr) {
      var slideDuration = parseInt(attr.slideToggleDuration, 10) || 200;

      // Watch for when the value bound to isOpen changes
      // When it changes trigger a slideToggle
      scope.$watch('isOpen', function(newIsOpenVal, oldIsOpenVal) {
        if (newIsOpenVal !== oldIsOpenVal) {
          element.stop().slideToggle(slideDuration);
        }
      });

    }
  };
});

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants