Question

如果我的控制器，我有一个函数将true设置为变量。

function setShow() {
  return this.isShow === 'Foo';
}

我的this.isShow是'Foo'

在我的模板中，我有<div ng-if = "vm.setShow()"> Hi </div>

但似乎在我的js函数执行之前加载了HTML？我不知道如何处理这个案子。我经常遇到这个问题。

Answer 1

来自ng-if：

如果表达式，ng-if指令将删除HTML元素   评估为假。

如果if语句的计算结果为true，则会添加Element的副本   在DOM中。

你的函数没有评估为true，这就是div没有显示的原因。尝试从函数返回true。

编辑：既然您编辑了帖子，问题似乎是函数不在$ scope中并且在ng中有一个奇怪的vm - 如果那可能不应该在那里。

Answer 2

你可以试试这个：

在angularjs中：但是$ timeout服务应该注入你的控制器。

 $timeout(function(){
// write your logic here
 },100);

当您的HTML文档准备就绪时，这将触发。在超时时间内调用你的函数。

或者在JavaScript中，您可以使用：

   Settimeout(function(){
   //write here
  },100);

Answer 3

您没有在 $ scope 中声明的setShow函数。我认为 ng-if 指令找不到该函数，并将其解释为false。
试试

＆＃13;

angular.module("myApp", []).controller("myCtrl", function($scope) {
    
   
   var isShow = "Foo";
    
    $scope.setShow = function () {
        return isShow == "Foo";
    }
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">
  <div ng-if="setShow()"> Hi </div>
   
</div>

＆＃13;

在我的js函数执行之前加载HTML

3 个答案: