移动到指令时角度代码不起作用

时间:2015-01-06 03:12:30

标签: angularjs angularjs-directive

我正在试图弄清楚为什么直接写在文件中的代码在我将其拆分成指令时突然无法呈现。

我有以下内容:

app.js

...
    app.directive('facilityImage', function(config){
    return{
        restrict: 'E',
        templateURL: "/includes/facility-image-dsp.html"
    };
});
....

/includes/facility-image-dsp.html

<div ng-controller="FacImgController" style="text-align:center; width: 100%;">
    <div class="imgblock" ng-repeat="item in facImages" ng-show="item.page == '{{myFunctions.subtabname}}'">
        <img src="{{item.image}}" />
    </div>
</div>

exam.html

<facility-image></facility-image>

我得到一个空白页面,错误日志说没有名为{{item.image}}的文件。

注意事项:

1)当指令中的代码直接放在exam.html中时,它可以很好地工作。

2)exam.html实际上是通过$ http.get()加载到index.php中的div中。该网站永远不会离开index.php。所有子页面都通过$ http.get()检索并替换内容div的内容。我遇到了一些麻烦,直到我学会了如何“重新编译”页面,并使Angular渲染得当。但是,现在,添加了指令部分,它就不再存在了。

我在这里想到的是,代码不起作用只是因为我将它移动到指令?

编辑:发生了一些时髦的事情,导致我测试的方式略有不同,似乎我错了。它似乎甚至没有在templateURL字段中加载文件!问题可能是!思考?我在指令调用中看不出有什么问题。

编辑二:在进一步测试和搜索日志之后,我甚至不认为<facility-image></facility-image>甚至在第一时间调用该指令!我将其更改为restrict: 'A',然后在HTML中将其更改为<div facility-image></div>并添加

link: function(){
    alert("I'm working!");
    }

一无所获。所以,似乎我的问题可能会进一步上升。任何人都可以想到为什么自定义调用不起作用的原因。因为我一直在看这段代码,所以甚至可以抛弃Captain Obvious的想法,并且可能会忽略最简单的事情!

1 个答案:

答案 0 :(得分:0)

哇!今天带着新鲜的眼睛回到这里并想出来了。

问题在于我写过

templateURL

而不是

templateUrl

显然它区分大小写! 现在工作正常!