gpt4 book ai didi

javascript - Angular ng-show 不根据函数返回值显示/隐藏

转载 作者:行者123 更新时间:2023-11-28 05:27:45 25 4
gpt4 key购买 nike

所以我的 Angular 应用程序是一个庞然大物,所以我将相关部分粘贴到这里只是为了看看 SO 的 Angular Gurus 是否能发现任何可以帮助我的东西。

我的 HTML 代码如下:

<span class='span_class' ng-show='{{showHideBasedOnFlag(id)}}'>
...data...
</span>

在 Angular 中我有:

$scope.showHideBasedOnFlag = function(id)
{

var flag = getFlag(id);
if(flag == 1) return true;
if(flag == -1) return false;
return true;
}

我有三个跨度,其中第一个的标志为 1,因此应显示,另外两个的标志为 -1,因此应隐藏。这在页面加载时按预期工作(第一个跨度显示,其他两个隐藏)。但是当我检查 span 2 和 3 时,它们的 HTML 代码如下所示:

<span class='span_class ng-hide' ng-show="false">

所以我的第一个问题是:ng-hide 被 Angular 添加以及 ng-show 也存在是否正常?当我的 HTML 中有代码 ng-show='{{showHideBasedOnFlag(id)}}'

时,两者都会被添加

其次,也是更重要的一点:我有一个按钮,单击该按钮时,会将跨度 2 和 3 的标志更新为 1 的值。发生这种情况后,我希望显示跨度,但没有显示。然后我显式调用了 showHideBasedOnFlag 函数和 console.logged 以确保该函数返回正确的 true 和 false。但是,我的 HTML DOM 没有变化,跨度仍然隐藏。

我为此伤透了脑筋,已经没有想法了......非常感谢任何帮助!!

最佳答案

您正在使用双括号进行插值。但是 ng-show 不是插入值的指令,它是基于 truthy/falsy 的。因此,您需要一个功能,到目前为止还不错。但是在 Angular 1.x 中,传递给函数的指令没有双括号。

<span class='span_class' ng-show='showHideBasedOnFlag(id)'>
...data...
</span>


So my first question is: Is it normal for ng-hide to get added by Angular as well as for ng-show to be also present? Both are getting added when I have the code ng-show='{{showHideBasedOnFlag(id)}}' in my HTML

是的,这是正常行为,因为 ng-show 和 ng-hide 是使用元素可见性属性的互补开关,而 ng-if 完全从 DOM 添加或删除元素。


关于javascript - Angular ng-show 不根据函数返回值显示/隐藏,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38687542/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com