AngularJS自定义指令(Directives)在IE8下的一个坑
在项目中，由于要兼容到IE8，我使用1.2.8版本的angularJS。这个版本是支持自定义指令的。我打算使用自定义指令将顶部的header从其他页面分离。也就是实现在需要header的页面只用在<body>后面加上<header></header>这个HTML标签就可以了，这样还能实现页面的语义化，而且也能在IE8中实现HTML5标签。以后很多部分都可以这一写，如搜索则可以变成<serach></serach>这样。但是在写好了后，才发现只有IE8不能这样写。（因为我是在LINUX系统下，只有在写好了才区IE测试。）代码如下
- var demoDirectives = angular.module('demoDirectives', []);
- /**
- * @namespace header
- * @desc 自定义angular指令<header>
- * @example <caption>Example usage of header.</caption>
- * // html
- *<header class="nav"></header>
- * @memberof angular_module.demoApp.demoDirectives
- */
- demoDirectives.directive('header', function () {
- return {
- restrict: 'E',
- templateUrl: 'demo/header.html'
- };
- });
- <body>
- <header class="navbar navbar-inverse" ng-controller="NavDirectiveCtrl"></header>
- <div ng-view class="container"></div>
- </body>
最后改成这样才能用
- var demoDirectives = angular.module('demoDirectives', []);
- /**
- * @namespace header
- * @desc 自定义angular指令<header>
- * @example <caption>Example usage of header.</caption>
- * // html
- *<header class="nav"></header>
- * @memberof angular_module.demoApp.demoDirectives
- */
- demoDirectives.directive('header', function () {
- return {
- templateUrl: 'demo/header.html'
- };
- });
- <body>
- <div header class="navbar navbar-inverse" ng-controller="NavDirectiveCtrl"></div>
- <div ng-view class="container"></div>
- </body>
AngularJS自定义指令(Directives)在IE8下的一个坑的更多相关文章
- 浅析AngularJS自定义指令之嵌入(transclude)
AngularJS自定义指令的嵌入功能与vue的插槽十分类似,都可以实现一些自定义内容展现.在开始之前先简单介绍下自定义指令的transclude属性和AngularJS的内置指令ng-transcl ...
- AngularJs自定义指令详解（1） - restrict
下面所有例子都使用angular-1.3.16.下载地址:http://cdn.bootcss.com/angular.js/1.3.16/angular.min.js 既然AngularJs快要发布 ...
- AngularJS: 自定义指令与控制器数据交互
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- angularjs自定义指令Directive
今天学习angularjs自定义指令Directive.Directive是一个非常棒的功能.可以实现我们自义的的功能方法. 下面的例子是演示用户在文本框输入的帐号是否为管理员的帐号"Adm ...
- [vue]vue条件渲染v-if(template)和自定义指令directives
条件渲染: v-if/template <div id="app"> <h1>v-show: display: none</h1> <di ...
- angularJs 自定义指令传值---父级与子级之间的通信
angularJs自定义指令用法我忽略,之前有写过,这里只说一下父子级之间如何传值: 例如: 模块我定义为myApp,index.html定义 <my-html bol-val="bo ...
- angularJS——自定义指令
主要介绍指令定义的选项配置 //angular指令的定义,myDirective ,使用驼峰命名法 angular.module('myApp', []) .directive('myDirectiv ...
- 利用angularJs自定义指令（directive）实现在页面某一部分内滑块随着滚动条上下滑动
最近老大让我一个效果实现在页面某一部分内滑块随着滚动条上下滑动,说明一下我们项目使用技术angularJs.大家都知道,使用jquery很好实现. 那么angular如何实现呢,我用的是自定义指令(d ...
- angularJs自定义指令（directive）实现滑块滑动
最近老大让我一个效果实现在页面某一部分内滑块随着滚动条上下滑动,说明一下我们项目使用技术angularJs.大家都知道,使用jquery很好实现. 那么angular如何实现呢,我用的是自定义指令(d ...
随机推荐
- Struts2笔记——ONGL表达式语言
OGNL是ObjectGraphic Navigation Language(对象图导航语言)的缩写,它是一个开源项目. Struts 2框架使用OGNL作为默认的表达式语言. ----------- ...
- Eclipse配置Flex开发环境（转）
Eclipse配置Flex开发环境 开发环境:Eclipse3.2.Flex Builder31.下载安装Flex Builder3,下载地址:http://subject.csdn.net/adob ...
- ES6入门之Symbol
ES5对象属性名都是字符串容易造成属性名的冲突. eg:var a = { name: 'lucy'}; a.name = 'lili';这样就会重写属性 ES6引入了一种新的原始数据类型Symbol ...
- PCB阻抗调节
在PCB厂家调节的阻抗指的是:传输线的“特征阻抗”,反映传输线上所走“行波”某点的电压和电流的比值,与线长无关.传输线本身的特性. 线宽:反比 介质厚度:正比
- [HDOJ1078]FatMouse and Cheese(记忆化搜索)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1078 题意:给出n, k,然后给出n*n的地图,(下标0~n-1),有一只老鼠从(0,0)处出发,只能 ...
- hdu4427Math Magic
4427 dp[i][j][k] i为K位的最小公倍数 j为k位的和 k以滚动数组的形式 这题最棒的是 有一个强有力的剪枝 组成公倍数m的肯定都是M的质因子 这样1000里面最多就30多个 复杂度可过 ...
- LEFT JOIN、Right、Full后ON和WHERE的区别
今天在工作的时候碰到了一个问题,A表B表left join后在on后面关于A表的条件过滤语句没起到我想要的过滤作用,还是对左连接等理解的不够呀. SELECT * FROM student; SELE ...
- .NET Framework 4.5 五个很棒的特性
转自http://news.cnblogs.com/n/192958/ 英文原文:Five Great .NET Framework 4.5 Features 简介 自 .NET 4.5 发布已经过了 ...
- React学习、安装及QuickStart
首先看的是这个页面 http://www.cocoachina.com/webapp/20150721/12692.html 这里有个内容差不多的版本(精华版):http://www.cnblogs. ...
- String.indexOf()
int indexOf(int ch) 返回指定字符在此字符串中第一次出现处的索引. int indexOf(int ch, int fromIndex) 从指定的索引开始搜索,返回在此字符串中第一次 ...