AngularJs的ng-include的使用与实现
想在angularjs动态加载一个内容,我们可以使用ng-include来实现。
今天Insus.NET就在ASP.NET MVC环境中,举个例子来演示它的功能。
你可以在一个视图动态加载任一其它视图。如果你的动态内容有很多部件,你得需要在控制器创建相应的Action操作,如使用部分Partial view就不必创建相对应的Action。因此这是Insus.NET所喜欢的。
另外,我们还需要为ng-include的链接带些参数呢!!!
因此,参数,即是使用model来实现:
由于ng-include的链接,直接给部分视图名称或路径,视图无法直接Render部分视图的。
那我们想一个办法,写一个公用的视图,所有部分视图均加载在这个公用的视图即可,使用这个公用的视图去Render这些部分视图。
在CommonView操作Action中,我们传入一个model,是为了后面传递参数准备的。
接下来,我把这个视图写好:
渲染部分视图的Action创建完毕。其也没有过多html的代码。
下面创建2个部分视图,当然实际环境中,也许不止2个啦。
部分视图_View1:
部分视图2:
前面一切准备好,均是为了下面ng-include的演示:
程序运行结果:
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 extreme ...
- 走进AngularJs(二) ng模板中常用指令的使用方式
通过使用模板,我们可以把model和controller中的数据组装起来呈现给浏览器,还可以通过数据绑定,实时更新视图,让我们的页面变成动态的.ng的模板真是让我爱不释手.学习ng道路还很漫长,从模板 ...
- 走进AngularJs(八) ng的路由机制
在谈路由机制前有必要先提一下现在比较流行的单页面应用,就是所谓的single page APP.为了实现无刷新的视图切换,我们通常会用ajax请求从后台取数据,然后套上HTML模板渲染在页面上,然而a ...
- AngularJS开发指南7:AngularJS本地化,国际化,以及兼容IE低版本浏览器
AngularJS本地化,国际化 国际化,简写为i18n,指的是使产品快速适应不同语言和文化. 本地化,简称l10n,是指使产品在特定文化和语言市场中可用. 对开发者来说,国际化一个应用意味着将所有的 ...
- angularJs项目实战!02:前端的页面分解与组装
自从上一篇文章到现在已经有将近一个月的时间,我将精力放在了前端页面分解与组装,和angularjs如何与jquery.bootstrap.D3等一系列其他类库结合使用的经验总结上.由于公司新招了一些员 ...
- AngularJs学习笔记--IE Compatibility 兼容老版本IE
原版地址:http://docs.angularjs.org/guide/ie Internet Explorer Compatibility 一.总括 这文章描述Internet Explorer( ...
- angularjs 手动启动
谷歌推的javascript框架angulajs相当火热,由于新项目的缘故,最近一直看angularjs.在看的时候,一直有个疑问,angularjs 核心依赖于DI(依赖注入).常用的方法是在页面的 ...
- AngularJS 学习之路(1)
AngularJS 是一个 JS 框架,适用于以数据操作为主的 SPA (Single Page Application)应用. 不再是 "先查找元素在操作元素",所有操作都以 & ...
- AngularJS进阶学习
参考:http://***/class/54f3ba65e564e50cfccbad4b 1. AJAX:Asynchronous JavaScript and XML(异步的 JavaScript ...
- 《Node.js+MongoDB+AngularJS Web开发》读书笔记及联想
总体介绍 <Node.js+MongoDB+AngularJS Web开发>,于2015年6月出版,是一本翻译过来的书,原书名为<Node.js,MongoDB and Angula ...
随机推荐
- SD从零开始71 业务信息仓库(BW)
SD从零开始71 业务信息仓库(BW)概念 在线事务处理的环境OLTP Environment 在事务处理中,我们不断地填充用于跟踪我们的业务流程的数千个不同步骤的特定的表: 例如,销售凭证行条目来自 ...
- openCV 色彩空间
---恢复内容开始--- 1.使用cv2.inrange()获取某个范围内的图像取值,指定某个通道的最小值和最大值 import numpy as np def color_space(image): ...
- Android--字符串和Drawable之间互相转化
//将字符串转化成Drawable public synchronized static Drawable StringToDrawable(String icon) { if (icon == nu ...
- loadrunner11中文版破解文档+录制脚本(图/文)
下面是整理后的loadrunner11破解版的所有文件及操作步骤. LoadRunner11安装 1.Loadrunner11下载链接:https://pan.baidu.com/s/15Svt3kt ...
- 我的简历 PHP Java C# 技术总监
石先生 ID:303321266 目前正在找工作 13611326258 hr_msn@163.com 男|32 岁 (1985/08/06)|现居住北京-海淀区|12年工作经验 ...
- SQL Server 2005详细安装过程及配置
说明:个人感觉SQL Server 2005是目前所有的SQL Server版本当中最好用的一个版本了,原因就是这个版本比起其它版本来说要安装简单,操作简便,只可惜这个版本只能在Windows7或者低 ...
- mysqlreport工具
进行MySQL的配置优化,首先必须找出MySQL的性能瓶颈所在:而SHOW STATUS输出的报告正是用来计算性能瓶颈的参考数据.mysqlreport不像SHOW STATUS那样简单的罗列数据,而 ...
- ISP与DSP的区别【转】
https://www.cnblogs.com/lifan3a/articles/5006760.html ISP 是Image Signal Processor 的简称,也就是图像信号处理器.而DS ...
- check
private int AddNewstoDB(NewsModels newsModels, string dateTimeStr, string jsonStr, string cid, strin ...
- git撤销本地提交但未push的记录
### git撤销本地提交但未push的记录 前言:有时候本地执行commit命令或者cherry-pick命令后发现提交了不需要提交的东西,就需要把已提交的commit记录撤销下来,简单做下记录 撤 ...