Question

我有一系列要显示的问题。

我想在问题旁边添加一个问号图标。

    <ul class="list-group" data-toggle="items" ng-repeat="ques in questions">
    <li class="list-group-item"><input type="checkbox" /> {{ques.question}} 
        <div ng-if="{{ques.description}}">
            <i class="glyphicon glyphicon-question-sign" title="{{ques.description}}"></i>
        </div>
    </li>
    </ul>

所以我添加了所有问题，当它有描述时我想添加一个图标。

如果您能提供帮助，上面的代码无效！

THX

Answer 1

ng-if="ques.description"

没有大括号，应该这样做，使用最新版本的angular.js（＆gt; 1.1）

有关详细信息，请查看ng-if official documentation

但是，如果您使用的是旧版本的angular.js ，则无法使用ng-if指令。它可以解释为什么始终显示您的glyphicon，无论ng-if条件如何。

如果是这种情况，这是一个解决方法：

<div ng-switch="ques.description==null">
   <i ng-switch-when="false" class="glyphicon glyphicon-question-sign" title="{{ques.description}}"></i>
</div>

Answer 2

尝试更改行：

<div ng-if="{{ques.description}}">

为：

<div ng-if="ques.description">

Answer 3

替换此部分：

    <div ng-if="{{ques.description}}">
        <i class="glyphicon glyphicon-question-sign" title="{{ques.description}}"></i>
    </div>

with：

<span ng-if="ques.description">
    <i class="glyphicon glyphicon-question-sign" title="{{ques.description}}"></i>
</span>

<强> Fiddle

Answer 4

第一件事记忆ng-if="expression"永远不适用于插值指令{{}}它需要一个表达式，如果你检查长度会很棒。

为了更好地使用title属性绑定ng-attr-title，它会在解析{{ques.description}}时创建title属性。

<div ng-if="ques.description.length > 0">
   <i class="glyphicon glyphicon-question-sign" ng-attr-title="{{ques.description}}"></i>
</div>

Answer 5

解决方案在我的帖子下面的评论中。

问题在于我在一个1.0.x版本的angularJS上没有ng-if指令。

我下载了一个新的angular.js，现在可以了！

AngularJS - ng-repeat with condition

5 个答案: