Menu
Is it possible to embed html page in another one in angular js?
If so, how to do it?
Here in their tutorial, the partial is not embedded in the page but it's like different page where you go when you click on one of the items. (see demo)
213
An Angular partial is simply an HTML file. The main difference between this and a full-fledged web page is that the partial contains only the HTML we need. There is no need for a ! DOCTYPE declaration, HTML, HEAD or BODY elements.
In AngularJS, templates are written with HTML that contains AngularJS-specific elements and attributes. AngularJS combines the template with information from the model and controller to render the dynamic view that a user sees in the browser.
These are the types of AngularJS elements and attributes you can use: Directive — An attribute or element that augments an existing DOM element or represents a reusable DOM component. Markup — The double curly brace notation {{ }} to bind expressions to elements is built-in AngularJS markup.
Yes, you can do it using ngInclude directive.
See the docs and example here: https://docs.angularjs.org/api/ng/directive/ngInclude
185
@Wilt is right, but here is a more specific link and a code sample (from https://github.com/angular-ui/ui-router/wiki/Quick-Reference#ui-view )
In your root template:
<div ui-view></div> <div ui-view="chart"></div> <div ui-view="data"></div> And in your app.config function
$stateProvider.state("home", { views: { "": { template: "<h1>Some HTML</h1>" }, "chart": { templateUrl: "templates/chart.html" }, "data": { template: "<data_thing/>" } } }) If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
