Stack Overflow
Stack Overflow

Questions tagged [angularjs-ng-include]

Fetches, compiles and includes an external HTML fragment.

Fetches, compiles and includes an external HTML fragment.

Usage

As element: (This directive can be used as custom element, but be aware of IE restrictions).

<ng-include
  src=""
  [onload=""]
  [autoscroll=""]>
...
</ng-include>

As attribute:

<ANY
  ng-include=""
  [onload=""]
  [autoscroll=""]>
...
</ANY>

As CSS class:

<ANY class="ng-include: ; [onload: ;] [autoscroll: ;]"> ... </ANY>

Reference:
https://docs.angularjs.org/api/ng/directive/ngInclude

467 questions
181
votes
4 answers

Losing scope when using ng-include

I have this module routes: var mainModule = angular.module('lpConnect', []). config(['$routeProvider', function ($routeProvider) { $routeProvider. when('/home', {template:'views/home.html', controller:HomeCtrl}). …
Shlomi Schwartz
  • 11,238
  • 25
  • 93
  • 155
121
votes
2 answers

AngularJS ng-include does not include view unless passed in $scope

Is it wrong to assume that ngInclude can take a raw path? I keep trying to set my ngInclude as follows:
This does not work but if I do something like this it does work. //…
Chad
  • 16,774
  • 8
  • 29
  • 41
94
votes
5 answers

Conditional ng-include in angularjs

How can I do the ng-include conditionally in angularJS? For example I only want to include something if, the variable x is set to true.
JustGoscha
  • 23,623
  • 14
  • 46
  • 61
93
votes
1 answer

AngularJS: ngInclude vs directive

I do not quite understand when to use a directive and when it would be more appropriate to use nginclude. Take this example: I have a partial, password-and-confirm-input-fields.html, that is the html for entering and confirming a password. I use…
EricC
  • 5,100
  • 9
  • 44
  • 68
63
votes
4 answers

Checkbox not binding to scope in angularjs

I am trying to bind a checkbox to scope using ng-model. The checkbox's initial state corresponds to the scope model just fine, but when I check/uncheck the checkbox, the model does not change. Some things to note is that the template is…
chris
  • 5,365
  • 5
  • 38
  • 52
52
votes
4 answers

Pass parameter to Angular ng-include

I am trying to display a binary tree of elements, which I go through recursively with ng-include. What is the difference between ng-init="item = item.left" and ng-repeat="item in item.left" ? In this example it behaves exactly the same, but I use…
Johannes
  • 2,442
  • 4
  • 20
  • 32
41
votes
8 answers

Angular passing scope to ng-include

I have a controller that I wrote that I use in multiple places in my app with ng-include and ng-repeat, like this:
In the controller/template, I…
kbjr
  • 1,225
  • 1
  • 10
  • 21
29
votes
2 answers

ng-include with a variable for src

I would like to change the ng-includes src with a variable. Currently this is what I have.
And here is the…
Austin Lovell
  • 1,039
  • 3
  • 15
  • 29
28
votes
4 answers

Webpack: using require for ng-include

I'm new to webpack and right now I'm using it for the first time in one of my angular projects. I want to use the require function in my html file in order to require the template for an ng-include like so:
Sebastian
  • 519
  • 1
  • 4
  • 14
27
votes
3 answers

AngularJS : ng-include and ng-controller

I have an app which I am building with angular, I have about 8-10 views to build out. All the views have a shared footer, based on the view and a set of business rules i need to conditionally show / hide some of the content on the footer. So. I have…
DShorty
  • 582
  • 1
  • 5
  • 12
27
votes
1 answer

How do I dynamically build an ng-include src?

I have the following code:
I want to be able to build a string in src like…
Adam K Dean
  • 7,135
  • 10
  • 43
  • 68
26
votes
3 answers

Why form undefined inside ng-include when checking $pristine or $setDirty()?

The following code throws the error "TypeError: Cannot read property '$pristine' of undefined" when I click the "check" button. app.controller('MainCtrl', function($scope) { // other stuff }) .controller('Ctrl2', function($scope) { …
Scott Driscoll
  • 2,827
  • 2
  • 21
  • 22
23
votes
5 answers

Avoid using extra DOM nodes when using nginclude

I'm struggling to wrap my mind around how to have an ng-include not use an extra DOM element as I'm building an angular app from a plain-HTML demo. I'm working with pretty slim HTML with fully developed, tightly DOM-coupled CSS (built from SASS) and…
Phil Thomas
  • 1,207
  • 1
  • 12
  • 32
21
votes
3 answers

Why does AngularJS ng-view not work locally?

I have been working for a few hours on getting my links to click through to different views with my AngularJS app. However, I can only seem to get the functionality to work online on Plunker. I've been trying to test the click-through functionality…
user2494584
  • 867
  • 4
  • 15
  • 29
18
votes
5 answers

ng-include compiles to a comment

I have an angular app, and want to in a template, add other as divs. ng-include seemed like a perfect choice. In main.html
In module.html
gombos
  • 193
  • 1
  • 1
  • 5
1
2 3
…
31 32