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>
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。