title: How to append <li> dynamically in angularjs?
body: <p>I have a html like this</p>
  
  <pre><code>&lt;ul class="list"&gt;  
      &lt;div ng-repeat="avis in avisData"&gt;  
          &lt;li id="li"&gt; 
              &lt;a class="item item-thumbnail-left" href=""&gt;&lt;img src=data:image/jpeg;base64,{{avis.imageClient}} style="width: 100px; height: 100px;"&gt;&lt;h3&gt;{{avis.avis.idconsommateur.nom}}&amp;nbsp;&amp;nbsp;{{avis.avis.idconsommateur.prenom}}&lt;/h3&gt;&lt;p&gt;{{avis.avis.commentaire}}&lt;/p&gt;&lt;/a&gt;
          &lt;/li&gt;
          &lt;br&gt;
      &lt;/div&gt; 
  &lt;/ul&gt;
  
  &lt;button class="button button-calm " style="float:right;height: 10px;" ng-controller="AvisEventController" ng-click="ecrireAvis()"&gt;
      &lt;div style="float: right;width:80%;"&gt;Ecrire&lt;/div&gt;
      &lt;div style="margin-top:0px;margin-right:10px;float:left;"&gt;
  
          &lt;i class="fa fa-pencil fa-lg" style="padding-right: 10px;margin-top: -28px;"&gt;&lt;/i&gt;
  
      &lt;/div&gt;
  &lt;/button&gt;
  </code></pre>
  
  <p>when i click on button('ecrire'), i want to append one li tag into the ul tag</p>
  
  <p>i have directive like this, i have tried this but it is not working it just add a li in ul without content :</p>
  
  <pre><code>$scope.ecrireAvis=function(){
  
      $scope.consommateur=angular.fromJson($localStorage.UserConsConnect);
      $scope.evenement=angular.fromJson($localStorage.event);
      var objAvis =new Object();
      objAvis.commentaire=$scope.commentaire;
      objAvis.idconsommateur= $scope.consommateur;
      objAvis.idevenement=$scope.evenement;
      alert($localStorage.star);
      objAvis.note=$localStorage.star;
  
      $http.post('http://127.0.0.1:8080/elodieService/avis/',objAvis).success(function(response, status, headers, config){
          alert("SUCCESS ajout dans la table Avis !!");
          $scope.avisData.push({commentaire:objAvis.commentaire});
      }).error(function(err, status, headers, config){
      //process error scenario.
      }); 
  </code></pre>
  
  <p>my service web:</p>
  
  <pre><code>{
  avis: {
  commentaire: "aaaaaaaa",
  date: null,
  idAvis: 8,
  idconsommateur: {},
  idevenement: {},
  imageJson: null,
  note: 3
  },
  imageAvis: null,
  imageClient: "/9j/2wBDAAgGBgcGBQgHBwcJCQgKDBQNDAsLDBkSEw8UHRofHh0aHBwgJC4nICIsIxwcKDcpL
  },
  </code></pre>
  
  <p><a href="https://i.stack.imgur.com/h4rrF.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/h4rrF.png" alt="enter image description here"></a></p>
  
  <p><a href="https://i.stack.imgur.com/vUHRA.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/vUHRA.png" alt="enter image description here"></a></p>