AngularJS ng-include

index.html

<html lang="en" ng-app="single_view">
<head>
  <script src="../jslib/angular.js"></script>
  <script src="../jslib/angular-route.js"></script>
   <script src="app.js"></script>
</head>
<body>

	<h4>below is the a page informaiton</h4>
	<div ng-include="‘view/a.html‘"></div>

	<h4>below is the b page informaiton</h4>
	<div ng-include="‘view/b.html‘"></div>

</body>
</html>

app.js

angular.module(‘single_view‘, []);

view/a.html

A page ...

view/b.html

B page ...

注:<div ng-include="‘view/b.html‘"></div> 要加单引号

时间： 2024-08-02 19:17:51

AngularJS ng-include的相关文章

Part 16 ng include directive in AngularJS

ng-include directive is used to embed an HTML page into another HTML page. This technique is extremely useful when you want to reuse a specific view in multiple pages in your application. The value of ng-include directive can be the name of the HTML

Part 15 AngularJS ng init directive

The ng-init directive allows you to evaluate an expression in the current scope. In the following example, the ng-init directive initializes employees variable which is then used in the ng-repeat directive to loop thru each employee. In a real world

Part 6 AngularJS ng repeat directive

ng-repeat is similar to foreach loop in C#. Let us understand this with an example. Here is what we want to do. 1. For each employee we have in the employees array we want a table row. With in each cell of the table row we to display employee Firstna

AngularJS开发指南7：AngularJS本地化，国际化，以及兼容IE低版本浏览器

AngularJS本地化,国际化国际化,简写为i18n,指的是使产品快速适应不同语言和文化. 本地化,简称l10n,是指使产品在特定文化和语言市场中可用. 对开发者来说,国际化一个应用意味着将所有的文字和其他因地区而异的数据从应用中抽离出来. 本地化意味着为这些抽离的数据和文字提供翻译和转变成本地的格式. 目前,AngularJS支持日期,数字和货币的国际化和本地化. 另外,AngularJS还通过ngPluralize指令支持本地多元化. 所有的AngularJS本地化组件都依赖于$loca

angularjs 学习笔记 -----结构定义

1. Module使用方法 var APP =angular.module('fontApp',['ngResource', 'ngRoute', 'ngSanitize']); APP为定义的别名,之后的调用都应尽量使用该别名 'fontApp' ng-app="fontApp" 新版本angular中route被分离出来,各个被使用的Providerdou需要在此处声明. 大型应用应该拆分模块来做,先定义一个服务模块,然后再加载它 angular.module('xmpl.ser

AngularJs学习笔记--IE Compatibility 兼容老版本IE

Short Version(简述) 为了让我们的angular应用在IE上工作,请确保: 1. 按需引入JSON.stringify(IE7或以下的都需要这玩意).我们可以使用JSON2(https://github.com/douglascrockford/JSON-js)或者JSON3(http://bestiejs.github.com/json3/). 2. 不要使用自定义标签,诸如<ng:view>(用属性版代替,如<div ng-view>).如果还是想使用,则请看第3

[AngularJS] AngularJS系列(1) 基础篇

目录什么是AngularJS? 为什么使用/ng特性 Hello World 内置指令内置过滤器模块化开发一年前开始使用AngularJS(以后简称ng),如今ng已经出2了.虽说2已完全变样,但是1.x还是足够优秀. 什么是AngularJS? ng是一个js框架,目前最新版本为1.5.8. 官网:https://angularjs.org/ 下载: Install-Package AngularJS.Core npm install [email protected] 为什么使用/n

[后端人员耍前端系列]AngularJs篇：使用AngularJs打造一个简易权限系统

一.引言上一篇博文已经向大家介绍了AngularJS核心的一些知识点,在这篇博文将介绍如何把AngularJs应用到实际项目中.本篇博文将使用AngularJS来打造一个简易的权限管理系统.下面不多说,直接进入主题. 二.整体架构设计介绍首先看下整个项目的架构设计图: 从上图可以看出整个项目的一个整体结构,接下来,我来详细介绍了项目的整体架构: 采用Asp.net Web API来实现REST 服务.这样的实现方式,已达到后端服务的公用.分别部署和更好地扩展.Web层依赖应用服务接口,并且使

AngularJs打造一个简易权限系统

AngularJs打造一个简易权限系统一.引言上一篇博文已经向大家介绍了AngularJS核心的一些知识点,在这篇博文将介绍如何把AngularJs应用到实际项目中.本篇博文将使用AngularJS来打造一个简易的权限管理系统.下面不多说,直接进入主题. 二.整体架构设计介绍首先看下整个项目的架构设计图: 从上图可以看出整个项目的一个整体结构,接下来,我来详细介绍了项目的整体架构: 采用Asp.net Web API来实现REST 服务.这样的实现方式,已达到后端服务的公用.分别部署和更好

走进AngularJs(二) ng模板中常用指令的使用方式

通过使用模板,我们可以把model和controller中的数据组装起来呈现给浏览器,还可以通过数据绑定,实时更新视图,让我们的页面变成动态的.ng的模板真是让我爱不释手.学习ng道路还很漫长,从模板开始入手是个不错方式,因为这部分内容相对简单好理解,而且是视图层的东西,大家都喜欢可以立马看得见的东西嘛.本篇我将搜罗模板中的常用指令一一测试,了解其使用方法,有点像背单词的感觉,会比较枯燥.不过对于初学,这样的枯燥是必须要经历的,开始~ 一.模板中可使用的东西及表达式模板中可以使用的东西包括以下