knockoutjs-如何观察全局变量的变化

Question

我需要观察变量myGlobalVar。我需要检测它的更改并显示它们。

function AppViewModel() {
this.myVar = ko.observable(myGlobalVar);
}
// Activates knockout.js
ko.applyBindings(new AppViewModel());

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>
<script>myGlobalVar = "Foo";</script>
<p>Test: <strong data-bind="text: myVar"></strong></p>
<script>
setTimeout(function() {
myGlobalVar = "Bar";
console.log("myVar set to 'Bar'. Proof:");
console.log(myGlobalVar);
}, 1000);
</script>

在上面的示例代码中，我最初将CCD_；Foo"；然后在3秒钟后将其设置为"0"；Bar"；，但是没有检测到变化。

Answer 1

您可以只更新可观察变量而不是全局变量，为此，我给您举了一个例子，说明如何使用vm.myVar(value(从任何地方更改它

如果你认为这没有帮助，那么请三思，你可以制作一个区间函数来设置当前的全局变量，比如vm.myVar(myGlobalVar(

这就是为什么"；可观察性"；存在希望它真的有帮助；(

myGlobalVar = "Foo";
function AppViewModel() {
this.myVar = ko.observable(myGlobalVar);
}
// Activates knockout.js (you see i´m assigning var vm)
var vm = new AppViewModel();
ko.applyBindings(vm);
setTimeout(function() {
// edit the observable to update view
vm.myVar("Bar") ;
console.log("myVar set to 'Bar'. Proof:");
console.log(vm.myVar());
}, 1000);

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>
<script>myGlobalVar = "Foo";</script>
<p>Test: <strong data-bind="text: myVar"></strong></p>

Answer 2

我能够将其求解为"；john Smith"；，我更改了它，添加了一个更改方法。我也可以只使用一个间隔，但在这种情况下更改会更好。

myGlobalVar = "Foo";
function AppViewModel() {
this.myVar = ko.observable(myGlobalVar);
}
// Activates knockout.js (you see i´m assigning var vm)
var vm = new AppViewModel();
ko.applyBindings(vm);
setTimeout(function() {
// edit the observable to update view
vm.myVar("Bar") ;
console.log("myVar set to 'Bar'. Proof:");
console.log(vm.myVar());
}, 1000);

$("#globalVarField").change(function() {
myGlobalVar = $(this).val();
console.log("globalVarField changed to '"+ myGlobalVar + "'");

vm.myVar(myGlobalVar);
});

.as-console-wrapper { max-height: 100px !important; }

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>
<script>myGlobalVar = "Foo";</script>
<p>Test: <strong data-bind="text: myVar"></strong></p>
Enter a value for myGlobalVar: <input type="text" id="globalVarField">