CODEWITHSUNDEEP
javascriptjqueryhtmlcssangularjs
Lemon
Lemon

Reputation: 199

targeting right html selector angular js

I am working on an angular directive and i am trying to prepend an element. 

.directive('someDirective', function($compile){
  restrict: "E",
  scope:{
   items="@"
  }
  link: function(scope,elem,attrs){
    // selector 
    angular.element(div > ul).prepend($compile('<p> Hello World <p>') (scope))
  },
  template:`
  <div class="container"> 
    <ul class="foo">
      <li ng-repeat="item in items"> {{ item }} </li> 
    </ul>
  </div>`
});

it appends inside ul. How am i supposed to append the element after the ul tag?

<div class="container"> 
    <ul class="foo">
      <!-- prepend element goes here :( --> 
      <li ng-repeat="item in items"> {{ item }} </li> 
    </ul>
 <!-- I want the prepended element to go here -->
  </div>`

i believe there is something wrong with my selector.

Upvotes: 1

Views: 20

Answers (1)

adeneo
adeneo

Reputation: 318302

To place an element after another element, and not inside it, you can use after(), it's part of Angulars jqLite as well

angular.element(div > ul).after($compile('<p> Hello World <p>') (scope))

Upvotes: 1

Related Questions