-1

I have created discussion forum application in angularjs. Once the user clicked the reply button on the post, I want to show the editor which is in the separate html file. How can I include that template on clicking the ng-click under that specific post.

Vijay VSTO
  • 133
  • 1
  • 4
  • 15

2 Answers2

1

How about a combination of ng-include with ng-if?

If you want to inject a template based on a certain condition, you can do it like this:

<div ng-include="'template.html'" ng-if="yourCondition"> </div>

where template.html is your filename and yourCondition should be an boolean expression.

Here is a plnkr to demonstrate: http://plnkr.co/edit/m50nKigoOWYwuczBIQdQ?p=preview

CozyAzure
  • 8,280
  • 7
  • 34
  • 52
0

As suggested above we can use combination of ng-if and ng-include to achieve require functionality :

<html ng-app="includeApp">
<head>
  <script type ="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.6/angular.js"></script>
  <script src="AppController.js"></script>
</head>
<body ng-controller="AppCtrl">
 <button ng-click="injectReply()">Include Reply</button>
<div ng-include="'reply.html'" ng-if="isReplyIncluded"></div>
</body>
</html>

Now code containing AppController.js :

angular.module('includeApp',[])
  .controller('AppCtrl',['$scope',function($scope){
   $scope.isReplyIncluded=false;
    $scope.injectReply= function (){
   //add reply.html by making this variable true
     $scope.isReplyIncluded=true;
    }
  }]);

Reply.html

<div>
You can add your editor html content here
</div>
Keshav
  • 821
  • 2
  • 12
  • 33
  • Hi Keshav, Thanks for your reply. The page will contain n number of posts.I have to insert the editor exactly under the post where the reply button is clicked. Hope my question in clear. – Vijay VSTO Sep 21 '15 at 04:50