Nrthugu

I'm very new to angularjs and currently studying mean stack. I'm using this code to open an html page then getting the id of clicked user.

<a href="/edit/{{ person._id }}">

<button type="button" ng-show="management.editAccess" class="btn btn-primary">Edit</button>

</a>

But I want to open my html as a modal, I tried this method here http://plnkr.co/edit/Y7jDj2hORWmJ95c96qoG?p=preview but it doesn't show the html, Please help me on how to open my whole html as modal.

You need to $http.get the template in html and then using $sce render it.

 <button data-toggle="modal" data-target="#theModal" ng-click="get()">get</button>



<div id="theModal" class="modal fade text-center">

    <div class="modal-dialog">

      <div class="modal-content">

        <div ng-bind-html="trustedHtml"></div>

      </div>

    </div>

  </div>

JS:

 $scope.get = function() {

        $http({

            method: 'GET',

            url: 'Lab6.html',



        })

            .then(function successCallback(data){



                $scope.data = data.data;

                console.log($scope.data);

                $scope.trustedHtml = $sce.trustAsHtml($scope.data);

                },

             function errorCallback(response){

                console.log(response);

                console.log('error');

            });

    }

Here is working plunker: http://plnkr.co/edit/SdCAep1dDH8UcpprwDH6?p=preview

Also I would argue that you should probably be using Angular UI Bootstrap to create your modal dialogs http://angular-ui.github.io/bootstrap/

Here is a cut down version of how to open a modal using Angular UI Bootrstrap:

$scope.open = function (vehicle) {



  var modalInstance = $modal.open({

    templateUrl: 'myModalContent.html',

    resolve: {

      items: function () {

        return $scope.items;

      }

    }

  });



};