Javascript 角度不'；不能在IE 8中工作，可以'；t为我的指令创建自定义元素_Javascript_Angularjs_Internet Explorer 8_Angularjs Directive

Javascript 角度不'；不能在IE 8中工作，可以'；t为我的指令创建自定义元素

javascript angularjs internet-explorer-8

Javascript 角度不'；不能在IE 8中工作，可以'；t为我的指令创建自定义元素,javascript,angularjs,internet-explorer-8,angularjs-directive,Javascript,Angularjs,Internet Explorer 8,Angularjs Directive,在过去的几周里，我从头开始构建我的应用程序。我是在执行指令时做的我不得不说，任何普通浏览器（如Mozilla或Chrome）都可以很好地使用，Angular.js框架对我来说非常有用问题是，在IE8中，一切似乎都被破坏了，document.createElement 当我尝试为custome指令创建元素时，DOM对象抛出一个errro（我还使用了'x-'前缀，这是btowser这个蹩脚借口所要求的）屏幕截图：应用程序索引： <!DOCTYPE html> <html

在过去的几周里，我从头开始构建我的应用程序。我是在执行指令时做的

我不得不说，任何普通浏览器（如Mozilla或Chrome）都可以很好地使用，Angular.js框架对我来说非常有用

问题是，在IE8中，一切似乎都被破坏了，document.createElement 当我尝试为custome指令创建元素时，DOM对象抛出一个errro（我还使用了'x-'前缀，这是btowser这个蹩脚借口所要求的）

屏幕截图：

应用程序索引：

<!DOCTYPE html>
<html xmlns:ng="http://angularjs.org" xmlns:x-restrict="" xmlns:x-fileupload="" class="ng-app" ng-app="myApp" ng-controller="homeCtrl">
    <link rel="stylesheet" type="text/css" href="css/foundation.css">
    <link rel="stylesheet" type="text/css" href="css/form.css">
    <link rel="stylesheet" type="text/css" href="css/meta.css">
    <!--[if lte IE 8]>
          <script src="js/json3.min.js"></script>
        <script>

        document.createElement('ng-include');
        document.createElement('ng-pluralize');
        document.createElement('ng-view');
        document.createElement('x-restrict');
        document.createElement('x-fileupload');
        // Optionally these for CSS
        document.createElement('ng:include');
        document.createElement('ng:pluralize');
        document.createElement('ng:view');
      </script>
    <![endif]-->
    <title>{{model.title}}</title>
  </head>
  <body>
  <div class="errorBar" ng-show="model.error.visible"><div class="errorBarContent">{{model.error.message}}</div></div>
  <div ng-include src="layout.menuSrc"></div>
    <div class="colmask threecol">
      <div class="colmid">
        <div class="colleft">
          <div class="col1">
            <ng-view></ng-view>
          </div>
          <div class="col2">
            <div ng-include src="layout.leftSideBarSrc"></div>
          </div>
          <div class="col3">
            <div ng-include src="layout.rightSideBarSrc"></div>
          </div>
        </div>
      </div>
     </div> 
<!--<div id="mainFrame">
      </div> -->

      <div ng-include src="layout.footerSrc" id="footer"></div>
    </div>
    <!-- TODO: REMOVE THE CDN JQUERY AND REPLACE IT WITH ONE THAT IS LOCATED WITHIN THE PROJECT -->
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script src="lib/angular/angular.js"></script>
    <script src="lib/angular/angular-resource.js"></script>
        <script src="js/app.js"></script>
    <script src="js/services.js"></script>
    <script src="js/controllers.js"></script>
    <script src="js/filters.js"></script>
    <script src="js/directives.js"></script>
    <script src="lib/bluimp/js/vendor/jquery.ui.widget.js"></script>
    <script src="lib/bluimp/js/jquery.iframe-transport.js"></script>
     <script src="lib/bluimp/js/jquery.fileupload.js"></script>

    </script>

</body>
</html>

你应该看看这个。有一些技巧你需要知道。每当我以Angular为目标的IE8，我都避免编写元素指令，而是坚持使用属性指令

谢谢你抽出时间，布莱恩。我相信我在我的问题中也提供了同样的联系。另外，我的所有指令都是restrict类型：“A”，正如您在我发布的代码中看到的那样。还是不行。再次谢谢你。我错过了。它指出的一点是，您需要将ng app设置为id:

id=“ng app”

（除了带有模块名称的属性之外）。您的示例中缺少了这一点。据我所知，您也可以使用：class=“ng app”，但我一定会尝试让您在页面加载时不出错，但该指令似乎仍然不起作用，也许explorer不起作用。也许$compile不能很好地与IE8配合使用，你能想出一个JSFIDLE来演示你的问题吗？我将IE8定位在一个复杂的角度站点上，没有任何问题。如果我真的遇到了问题，它往往是需要补充的东西。我会彻底抛弃

文档.createElement

代码，将所有内容都转换为属性（包括

ng视图

）。

angular.module('myApp.directives', []).
directive('x-restrict', function(authService){
    return{
        restrict: 'A',
        prioriry: 100000,
        scope: false,
        link: function(){
            // alert('ergo sum!');
        },
        compile:  function(element, attr, linker){
            var accessDenied = true;
            var user = authService.getUser();
            var attributes = attr.access.split(" ");
            for(var i in attributes){
                if(user.role == attributes[i]){
                    accessDenied = false;
                }
            }


            if(accessDenied){
                element.children().remove();
                element.remove();           
            }

        }
    }
});