[Angular.js] directives in IE8

2013-08-06

2205
0
Angular.js

在Angular.js中,使用directive的方式有EACM

Element, Attribute, Class 跟CoMment

也就是你可以在html中使用像下列的標籤

<my-directive></my-directive>

<div my-directive></div>

<div class="my-directive"></div>

然後再透過angular.js建立directive,並指定restrict指定那些標籤應該要被套用

var app = angular.module("app",[]).directive("myDirective", function () {
    return {
        restrict: 'A',
        template: "<div>hello world from attribute</div>"
    }
});

使用directive的方式,如果是透過attribute或是class的value的方式,在IE8上沒有甚麼太大的問題.

但是如果是透過element的方式的話,IE8就會出現像下面的錯誤

Error: Unknown runtime errorundefined

而要修正這個問題,你可以在header中加上下面片段

而如果你是透過comment的方式,在IE8也會出現相同的錯誤訊息,

而這時你就要在directive的return的object定義中加上replace:true, 如

app.directive("myDirective", function () {
    return {
        restrict: 'M',
        replace: true,
        template: "<div>hello world from comment</div>"
    }
});

而這個replace這個設定值,也是跟所產生的html很有關係.

你可以在下面這個網址玩玩看.

demo : http://jsfiddle.net/ajunlee/nA2Sr/

最後總結 : 如果要自訂directive的話,比較好的方式還是統一使用attribute或是class.

回首頁