ng-include如何在Angular.js中使用

二、Ng-Include的使用

多标签button编写好了，需要对点击的button展示对应的页面内容，这里使用ng-include来管理代码。如下：

 这里不管写什么都不会展示,完全被ng-include取代
 

这里我使用的是ng-show,即在页面加载的时候就把全部的内容加载完毕了，可以起到一个预加载的效果，当然，如果需要点击对应button的时候再展示相应的内容则可以使用ng-if，效果一样。

ng-include后面写的是html文件对应的url地址，是相对于index.html的地址。

来看一下template1的代码：

 
 {{x.name}}
 

我对template1进行了单独的controller管理，Ctrl代码为：

angular.module('includeExample', ['ionic'])
 .controller('template1Controller', ['$scope', function ($scope) {
 $scope.tests = [
  {
  name: 'test1'
  }, {
  name: 'test2'
  }, {
  name: 'test3'
  }
 ]
 }]);

关于ng-include如何在Angular.js中使用就分享到这里了，希望以上内容可以对大家有一定的帮助，可以学到更多知识。如果觉得文章不错，可以把它分享出去让更多的人看到。

分享至：

   

关于我们

公司简介 发展历程

服务项目

高端网站建设 小程序开发 APP开发 网络营销

建站知识

行业新闻 建站学堂 常见问题

联系我们

公司地址 人才招聘

成都 什邡



电话：028-86922220



地址：成都市太升南路288号锦天国际A幢1002号



电话：028-86922220



地址：德阳市什邡市顺河路物华南苑B区

友情链接： 响应式网站建设公司   php主机   食品包装设计   lzwzjz.cn   电商网站建设方案   企业网站设计   阿坝网站设计   温江服务器托管   光华服务器托管   LED显示屏   

版权所有：青羊区美图云海设计工作室（个体工商户） 蜀ICP备2025119305号-5