如何将 vm 传递给 AngularJs 中的 setTimeout?对范围的更改不会更新 DOM 视图 [英] How to pass vm to a setTimeout in AngularJs? Changes to scope don't update DOM view

问题描述

我正在尝试以下代码.当我看到组件根据我为变量设置的值出现/消失时，一切似乎都在工作.但是，当我在 setTimeout(...) 函数中这样做时，它开始行为不端.poofy 文本显示但设置为 vm 的值没有.我的猜测是我需要以某种方式传递它，但我不确定如何传递.

I'm trying the following code. Everything seems to be working as I see the component appear/disappear depending on the value I set for the variable. However, when I do that in the setTimeout(...) function, it starts to misbehave. The poofy text shows but the value set to vm doesn't. My guess is that I need to pass it in somehow but I'm not sure how.

(function () {
  'use strict';

  angular
    .module("app")
    .controller("Banana", banana);

  function banana() {
    var vm = this;
    vm.showStuff = false;

    setTimeout(function () {
      console.log("poof!");
      vm.showStuff = true;
    }, 1000);
  }
})();

我需要让视图模型全局可访问吗?

Do I need to make the view-model globally accessible?

推荐答案

尝试使用下面的脚本.

(function () {
    'use strict';

     angular
         .module("app")
         .controller("Banana", banana);

     function banana($timeout) {
        var vm = this;
        vm.showStuff = false;

        $timeout(function () {
            console.log("poof!");
            vm.showStuff = true;
        }, 1000);
     }
})();

需要注意的是 - 需要额外的步骤.

To be noted - there's additional step required.

1. 将 setTimeout(...) 替换为 $timeout(...).
2. 将 $timeout 传入 banana(...).
3. 提供banana.$inject = ["$timeout",...].

1. Substitute setTimeout(...) for $timeout(...).
2. Pass $timeout into banana(...).
3. Provide banana.$inject = ["$timeout",...].

这篇关于如何将 vm 传递给 AngularJs 中的 setTimeout?对范围的更改不会更新 DOM 视图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！