I started studying Angular and there was a problem with ng-include.
Here is an example , only without the add and remove function.

And this piece "below" I want to put in a separate file. Question: "How?". If I bear it, then it is not loaded.

<script type="text/ng-template" id="tree_item_renderer.html"> {{data.name}} <ul> <li ng-repeat="data in data.nodes" ng-include="'tree_item_renderer.html'"></li> </ul> </script>

This is if running under the nodejs server. But if you just run as html page, then everything works as I want. What's wrong?

Here is the server code:

 var port = process.env.PORT || 8080; app.use(express.static(__dirname + '/app')); require('./app/routes')(app); // pass our application into our routes app.listen(port); console.log('Magic happens on port ' + port); exports = module.exports = app;
  • you need to see where the browser makes the request and change the path to the desired one - Grundy
  • Request URL:http://localhost:3000/treeTemplate.html Type:xhr Request Method:GET Status Code:304 Not Modified Remote Address:127.0.0.1:3000 Response Headers accept-ranges:bytes cache-control:public, max-age=0 connection:close date:Fri, 15 Jul 2016 19:14:59 GMT etag:W/"c6-155e0841587" last-modified:Tue, 12 Jul 2016 19:10:00 GMT x-powered-by:Express Request Headers Accept:application/json, text/plain, */* Accept-Encoding:gzip, deflate, sdch Accept-Language:ru-RU,ru;q=0.8,en-US;q=0.6,en;q=0.4 Cache-Control:max-age=0 Connection:keep-alive Host:localhost:3000 - Dmitriy
  • that is, it still loads - Grundy
  • Well loads, but somehow it is not clear. But what Che shows browser if you watch html. Why does he select tags? i11.pixs.ru/storage/7/1/8/skrinPNG_7182013_22638718.png - Dmitriy
  • Yes, and {{item.title}} for some reason is empty. I read somewhere that the problem may be in xhr, so nodejs express must also indicate this type somewhere ... - Dmitriy

1 answer 1

It turns out that in order to render a template into a separate file, the code needs to be written without <script> tags, ie:

 {{item.title}} <ul> <li ng-repeat="item in item.nodes" ng-include src="'treeTemplate.html'">/li> </ul>

Thanks Grundy for the tip!