角指令NG-如果不评估条件语句 [英] Angular directive ng-if does not evaluate conditional statement

问题描述

我是新来的web开发和AngularJS。我试图用指令NG-如果只显示一个div块，如果从数据库中返回一个列表大于1，但它不工作。我是否滥用指令？我环顾四周，并没有发现任何工作的解决方案。目前，同时显示的div和NG-IFS被忽略。

 ＆LT; D​​IV＆GT;
    ＆所述;股利纳克-如果=listOfThings.length→1＆GT;
        ＆LT; H1＆GT; {{listOfThings.length}}＆LT; / H1＆GT;
        ＆LT; / BR＆GT;
        ＆LT; D​​IV NG重复=事情listOfThings＆GT;
           ＆LT;标签＆gt; {{thing.name}}＆LT; /标签＆gt;
        ＆LT; / DIV＆GT;
    ＆LT; / DIV＆GT;
    ＆LT; D​​IV NG-IF =listOfThings.length == 1级=COL-SM-4 COL-SM-偏移4＆GT;
        ＆LT; H1＆GT; {{listOfThings [0]。名称}}＆下; / H1＆GT;
        ＆LT; IFRAME WIDTH =560HEIGHT =315NG-SRC ={{listOfThings [0] .embed}}FRAMEBORDER =0的allowFullScreen＆GT;＆LT; / IFRAME＆GT;
    ＆LT; / DIV＆GT;
＆LT; / DIV＆GT;
 

我想这code，它在Plunker工作，但不是在我的code出于某种原因。在我的code，只NG-应用程序的工作原理，但NG-如果还不行。

 ＆LT; D​​IV NG-应用=ngAnimate＆GT;
        点击我：＆LT;输入类型=文本NG模型=检查NG-的init =检查='秀'/＆GT;＆LT; BR /＆GT;
        当显示检查：{{检查}}
        ＆LT;输入NG-IF =！=检查'隐藏'级=动画假设占位=输入单词隐藏/＆GT;
    ＆LT; / DIV＆GT;
 

解决方案

你想代替本什么

NG-IF ={{listOfThings.length}}→1是这样的：

  NG-IF =listOfThings.length大于1
 

NG-如果将评估前pression。

勾选此 在线演示

I'm new to web dev and AngularJS. I'm trying to use the directive ng-if to only display a div block if a list returned from the database is greater than 1, but it's not working. Am I misusing the directive? I've looked around and haven't found any solutions that work. Currently, both divs are displayed and the ng-ifs are ignored.

<div>
    <div ng-if="listOfThings.length > 1">
        <h1> {{listOfThings.length}} </h1>
        </br>
        <div ng-repeat="thing in listOfThings">
           <label> {{ thing.name }} </label>
        </div>
    </div>
    <div ng-if="listOfThings.length == 1" class="col-sm-4 col-sm-offset-4">
        <h1> {{ listOfThings[0].name }} </h1>
        <iframe width="560" height="315" ng-src="{{ listOfThings[0].embed }}" frameborder="0" allowfullscreen></iframe>
    </div>
</div>

I tried this code, which works in Plunker, but not in my code for some reason. In my code, only ng-app works, but ng-if still does not.

    <div ng-app="ngAnimate">
        Click me: <input type="text" ng-model="check" ng-init="check='show'" /><br/>
        Show when check: {{check}}
        <input ng-if="check!='hide'" class="animate-if" placeholder="type the word 'hide'"/>
    </div>

解决方案

What you want instead of this ng-if="{{listOfThings.length}} > 1" is this:

 ng-if="listOfThings.length>1"

ng-if will evaluate the expression.

Check this Online Demo

这篇关于角指令NG-如果不评估条件语句的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！