Question

我有一个指令，根据输入属性id是否存在，呈现活动或禁用的文件链接。

该指令称为filelink：

<filelink id="{{resource.id}}" type="{{resource.mimetype}}" name="{{resource.name}}" size="{{resource.size}}" icon="hide"></filelink>

这是指令代码：

.directive('filelink', function() {
    return {
        restrict: 'E',
        replace:true,
        scope: true,
        template:"<span></span>",
        link: function($scope, $element, $attrs){
            $attrs.$observe('id', function (value) {
                if(value == ""){
                    $element.append("<span class='heading' href=''>  "+$attrs.name+" <i class='icon-lock'></i></span>")
                }else{
                    $element.append("<a class='heading' href='t3a/index.php?id=5&tx_crcdata_crc_data_mgm[controller]=Dataset&tx_crcdata_crc_data_mgm[action]=readFile&tx_crcdata_crc_data_mgm[id]="+$attrs.id+"&tx_crcdata_crc_data_mgm[type]="+$attrs.type+"&tx_crcdata_crc_data_mgm[name]="+$attrs.name+"&tx_crcdata_crc_data_mgm[size]="+$attrs.size+"' style='padding-left: 10px;' title='"+$attrs.name+"'>  "+$attrs.name+" </a> ")
                 }
             });
          }
        };
      });

通过控制器外部的解析器异步接收id值：

DatasetDetailCtrl.resolve = {
  dataset: function($route, Package) {
    Package.getSinglePackage($route.current.params.datasetId);
  },
  delay: function($q, $timeout) {
    var delay = $q.defer();
    $timeout(delay.resolve, 1000);
    return delay.promise;
  }
};

该指令在Firefox 16中完全正常，但在Chrome和IE中，该指令不起作用，因为所有$ attrs都是“未定义”。似乎观察异步调用数据不起作用

为什么会出现这种情况？

AngularJS自定义指令适用于FF16，但不适用于IE或Chrome

0 个答案: