Question

我正在尝试创建一个指令，该指令将评级作为输入，并根据此输入绘制DOM中的星号。

然而，当我尝试以下内容时：

.directive('stars', function (Utils) {

    return {
        restrict: 'AE', //E = element, A = attribute, C = class, M = comment  
        transclude: true,
        template: "{{starsObj}}",
        link: function (scope, element, attrs) {

           scope.starsObj = Utils.returnStars(attrs.rating)

        } 
    }

})

其中Utils.returnStars(attrs.rating)返回一个数组（我想稍后使用）。

...我收到以下错误：

多指令资源争用

https://docs.angularjs.org/error/ $编译/ multidir P0 =评级＆安培; P1 = 20％（模块：％20ui.bootstrap.rating）？＆安培; P2 =分＆安培; P3 = 20％（模块：％20noodl.controllers副产物）及P4 =模板＆安培; P5 =％3Cspan％20ng的-鼠标离开％3D％22reset（）％22％20rating％3D％225％22％3E

从我的项目中删除ui-bootstrap解决了这个问题，但我最终还是需要ui-bootstrap。

发生了什么事？

Answer 1

您无需添加“范围”。从指令范围到变量的前缀，因此您应该将指令的var selectedFileInfo = (FileInfo)listbox2.SelectedItem; var selectedFileName = selectedFileInfo.Name; //etc属性更改为：

template

Demo on plunker.

UPD：但我发现您的控制台错误与return { restrict: 'AE', //E = element, A = attribute, C = class, M = comment transclude: true, template: "{{starsObj}}", //You don't need 'scope.' prefix. link: function (scope, element, attrs) { scope.starsObj = Utils.returnStars(attrs.rating) } }有关。您可以在使用它的地方提供更多代码吗？

UPD2：这里的问题是ui-bootstrap有自己的rating指令。因此，要解决此问题，您只需将ui.bootstrap指令的rating属性重命名为其他内容即可。我更新了我的plunker。

错误＆＃39;多指令资源争用＆＃39;创建自定义指令和使用UI-bootstrap时

1 个答案: