相关疑难解决方法(0)

ng-show ="true"但仍有class ="ng-hide"

我是AngularJS的新手,因此我的问题可能会有一个简单的解决方案.我一直在研究这个表格.我有两个输入 - 一个用于门的数量,一个用于窗口的数量.然后,如果他们满足一定数量的门窗,我想要展示几个div.当我在输入中输入数字时,ng-show解析为"true".但该元素仍然具有"ng-hide"类,仍然隐藏它.

这是我的代码示例:

<body ng-app>
Doors: <input type="number" ng-model="doors"><br>
Windows: <input type="number" ng-model="windows"><br>

<div ng-show="{{(doors + windows) < 6}}">
  Shows if you have 0-5 doors and windows combined.
</div>
<div ng-show="{{(doors + windows) > 5 && (doors + windows) < 11}}">
  Shows if you have 6-10 doors and windows combined.
</div>
<div ng-show="{{(doors + windows) > 10 }}">
  Shows if you have more than 10 doors and windows combined.
</div>
</body>
Run Code Online (Sandbox Code Playgroud)

这是我进入3门和4个窗口时的输出:

<div ng-show="false" class="ng-hide">
  Shows if you have …
Run Code Online (Sandbox Code Playgroud)

forms angularjs ng-show

46
推荐指数
1
解决办法
3万
查看次数

为什么在ng-show使用ng-hide可以适用于这两种情况

我已经通过像这么多的问题,走了这个,但得到这唯一的解决办法ng-show在默认情况下隐藏的元素并显示,如果条件为真,而另一方面ng-hide默认显示的元素,隐藏它时条件为真.

但我担心的是,条件可以照顾,ng-show或者ng-hide只是为什么我们使用不同的东西.

例如

我看到这个地方在此代码用户使用ng-showng-hide

<div ng-init="isShow = 'one'">
    <a href="#" ng-click="isShow == 'one' ? isShow = 'two' : isShow = 'one'">
    <div ng-show="isShow=='one'">
        If One show this
    </div>
    <div ng-hide="isShow=='one'">
        If Two show this
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

但据我所知,这个代码也可以实现

<div ng-init="isShow = 'one'">
    <a href="#" ng-click="isShow == 'one' ? isShow = 'two' : isShow = 'one'">
    <div ng-show="isShow=='one'">
        If One show this
    </div>
    <div ng-show="isShow=='two'">
        If Two show …
Run Code Online (Sandbox Code Playgroud)

html javascript jquery angularjs

4
推荐指数
1
解决办法
467
查看次数

标签 统计

angularjs ×2

forms ×1

html ×1

javascript ×1

jquery ×1

ng-show ×1