在项目中，由于要兼容到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下的一个坑的更多相关文章

  1. 浅析AngularJS自定义指令之嵌入(transclude)

    AngularJS自定义指令的嵌入功能与vue的插槽十分类似,都可以实现一些自定义内容展现.在开始之前先简单介绍下自定义指令的transclude属性和AngularJS的内置指令ng-transcl ...

  2. AngularJs自定义指令详解（1） - restrict

    下面所有例子都使用angular-1.3.16.下载地址:http://cdn.bootcss.com/angular.js/1.3.16/angular.min.js 既然AngularJs快要发布 ...

  3. AngularJS: 自定义指令与控制器数据交互

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  4. angularjs自定义指令Directive

    今天学习angularjs自定义指令Directive.Directive是一个非常棒的功能.可以实现我们自义的的功能方法. 下面的例子是演示用户在文本框输入的帐号是否为管理员的帐号"Adm ...

  5. [vue]vue条件渲染v-if(template)和自定义指令directives

    条件渲染: v-if/template <div id="app"> <h1>v-show: display: none</h1> <di ...

  6. angularJs 自定义指令传值---父级与子级之间的通信

    angularJs自定义指令用法我忽略,之前有写过,这里只说一下父子级之间如何传值: 例如: 模块我定义为myApp,index.html定义 <my-html bol-val="bo ...

  7. angularJS——自定义指令

    主要介绍指令定义的选项配置 //angular指令的定义,myDirective ,使用驼峰命名法 angular.module('myApp', []) .directive('myDirectiv ...

  8. 利用angularJs自定义指令（directive）实现在页面某一部分内滑块随着滚动条上下滑动

    最近老大让我一个效果实现在页面某一部分内滑块随着滚动条上下滑动,说明一下我们项目使用技术angularJs.大家都知道,使用jquery很好实现. 那么angular如何实现呢,我用的是自定义指令(d ...

  9. angularJs自定义指令（directive）实现滑块滑动

    最近老大让我一个效果实现在页面某一部分内滑块随着滚动条上下滑动,说明一下我们项目使用技术angularJs.大家都知道,使用jquery很好实现. 那么angular如何实现呢,我用的是自定义指令(d ...

随机推荐

  1. swift：入门知识之枚举和结构体

    枚举: swift中的枚举有些类似于类这个概念,它有自己的属性,也可以有自己的方法 枚举中的成员有原始值和实际值之分,原始值用来枚举成员的排序次序,默认从0开始 枚举出来的成员值就是实际值 可以通过t ...

  2. Linux命令-grep

    grep命令用于对文本进行搜索,格式为“grep [选项] [文件]” 搜索某个关键词:"grep 关键词 文本文件" 参数说明 -b 将可执行文件当做文本文件来搜索 -c 仅显示 ...

  3. Android 实现Path2.0中绚丽的的旋转菜单

    上图先: 那么下面开始吧~ 首先,将整个菜单动画分解开来. 1.       一级菜单按钮的旋转动画2个,十字和叉叉状态的转换. 2.       二级菜单按钮的平移动画2个,弹簧效果的in和out ...

  4. PHP 对象和数组互相转换

    最简单的:$array = (array)$object; 但是, 如果对象的属性也是个对象的话, 就转换不了了, 就是说PHP的强制类型转换不能把对象属性中的对象转换成数组的下一个维度的数组, 刚刚 ...

  5. ffmpeg mp4转yuv

    mp4转yuv ffmpeg -i test.mp4 test.yuv 播放yuv ffplay.exe -f rawvideo -video_size 1280x720 -i test.yuv

  6. Oracle数据库之二

    SELECT查询 函数分为: 单行函数 -- 一条记录进入,一条记录输出 多行函数(分组函数)-- 多条记录进入,按组输出 单行函数: select id,first_name,nvl(commiss ...

  7. 安装SQL2008的时候 出现System.Configuration.ConfigurationErrorsException: 创建 userSettings/Microsoft.SqlServe

    System.Configuration.ConfigurationErrorsException: 创建 userSettings/Microsoft.SqlServer.Configuration ...

  8. UVa 10815 Andy's First Dictionary

    感觉这道题要比之前几个字符串处理的题目难度要大了一些. 题目大意:给若干行字符串,提取出所有单词并去掉重复的,最后按字典顺序输出. 对于输入大致有两种思路,一种是逐个读入字符,遇到字母的话就放到wor ...

  9. HDU 2062 Subset sequence

    我是把它当做一道数学题来做的. 这篇题解写的有点啰嗦,但是是我最原始的思维过程. 对于一个集合An= { 1, 2, …, n },在n比较小的情况下,在纸上按字典顺序把所有子集排列一下. 以n=3, ...

  10. codeforces 450 B Jzzhu and Sequences

    题意:给出f1=x,f2=y,f(i)=f(i-1)+f(i+1),求f(n)模上10e9+7 因为 可以求出通项公式:f(i)=f(i-1)-f(i-2) 然后 f1=x; f2=y; f3=y-x ...