I have a HTML file where on click of a hyperlink i need to load another HTML file in a DIV inside the first HTML file. Can i achieve this in AngularJS? If so how? Also there is ng-Grid in the HTML. here is the code am trying:
3 Answers
The nice thing about hyperlinks is that they generally map a HTTP GET request to a reusable url.
If you use $routeProvider and
<a href="#/table">table</table>
<div ng-view="table"></div>
like this: http://plnkr.co/edit/ZlVZZYw9wQIDza7NeVtu?p=preview
You can ctrl-click the the link, open the link in new tabs/windows or share the link.
5 Comments
Akshar A K
But there is ng-grid in the HTML am trying to load. HTML is getting loaded. But data in the Grid is not loading... Here is the plunk: plnkr.co/edit/5ghLaC7hWnUS2oqCKaiU?p=preview
Thomas B Homburg
The template you include in the
#about route, should only be a html fragment and you should probably load your table controller logic in aboutController, like so: plnkr.co/edit/1pqGmPh4pbWJTCrOJqIQ?p=previewAkshar A K
what ever is there is the plunker is what i need. But if i use that am getting an error. Error: Unknown provider: $sceProvider <- $sce <- $route <- ngViewDirective
Thomas B Homburg
Do you get
$sceProvider error on this page: plnkr.co/edit/1pqGmPh4pbWJTCrOJqIQ?p=preview ? I can't see the $sce service referenced anywhere in the code.Akshar A K
Its working now. But why is the CSS not applying for the Grid?
Here is the code:
<a ng-click="showAdditionalContent = true">Show</a>
<div ng-if="showAdditionalContent" ng-include="html/file.html">
</div>
3 Comments
Akshar A K
But there is ng-grid in the HTML am trying to load. HTML is getting loaded. But data in the Grid is not loading... Here is the plunk: plnkr.co/edit/5ghLaC7hWnUS2oqCKaiU?p=preview
driver_by
You have problems in your code. For example you bootstrap your app for second time
app = angular.module('myApp', ['ngGrid']);. Just don't mess your js, place it in separate fileAkshar A K
even if i remove that piece of code its not working.
You can also use the ngBindHtml directive too.
1 Comment
Akshar A K
But there is ng-grid in the HTML am trying to load. HTML is getting loaded. But data in the Grid is not loading... Here is the plunk: plnkr.co/edit/5ghLaC7hWnUS2oqCKaiU?p=preview