有条件地应用属性（AngularJS）

【问题标题】：Conditionally apply an attribute (AngularJS)有条件地应用属性（AngularJS）
【发布时间】：2014-11-04 13:22:16
【问题描述】：

问题是当我尝试有条件地应用“has-dropdown”属性时，我收到以下 Angular 嵌入错误：

错误：[$compile:ctreq] 控制器“hasDropdown”，指令“ngTransclude”需要，找不到！它引用了 angular.js 第 9563 行

。我试图应用的逻辑是：

如果 subNav 数组为空，则不要在元素中显示“has-dropdown”属性。
如果不为空，则添加“has-dropdown”属性。

我错过了什么？

 <code>
<li ng-repeat="nav in app.mainNavItems" 

 {{app.mainNavItems.subNavs.length > 0 ? "has-dropdown" : ""}}>  
 </code>

【问题讨论】：

标签： javascript angularjs attributes conditional

【解决方案1】：

你不能这样做。您应该创建一个指令，在编译阶段应该检查 app.mainNavItems.subNavs.length > 0 并使用 $element.attr('has-dropdown') 添加属性

类似这样的：

var myModule = angular.module(...);

myModule.directive('directiveName', function($parse) {
    return {
        restrict: 'A',
        compile: function compile(tElement, tAttrs, transclude) {
             if($parse(tAttrs.directiveName)()) {
                 tElement.attr('has-dropdown');
             }
        }
    };
});

模板：

<li ng-repeat="nav in app.mainNavItems" directive-name="app.mainNavItems.subNavs.length > 0">

注意：未经测试，仅来自我的头顶..

【讨论】：

感谢您的时间 Domakas 例如，如果 (array.length > 0) Li 需要看起来像这样
。如果 (array.length 您的代码只是分配了 true 或 false，这与我想要实现的目标不同。