在這種情況下，ko.observable究竟在做什麼？

那麼ko.observable（）究竟幹什麼？這是情況。你可以看到，我有一個布爾ko.observable（）。我點擊設置爲該值，所以它應該切換包含在它的方法調用中的真假的值。在這種情況下，ko.observable究竟在做什麼？

當我看到數組被填充到開發人員工具中時，我看到所選內容不是= true或false，而是=相當廣泛的函數，並且我無法在該內部的任何位置找到true或false值，所以我不知道什麼時候使用ko.observable（）

我所期望的是tab.selected是tabArray [tab] .selected的值，並且當頁面加載時，正確。但是，在寫出文本值時，單擊tabArray [tab] .selected = [Object object]後。我嘗試使用：

<pre data-bind="text: JSON.stringify(ko.toJS(tab.selected)"></pre>

（這裏找到：http://www.knockmeout.net/2013/06/knockout-debugging-strategies-plugin.html），並打印出真或假，我需要在其他地方做這個，我需要的是價值？因爲我不確定ko.observable在做什麼。

define(['knockout', 'text!../Content/SSB/PartialViews/MainContent.html'], function (ko, MCTemplate) { 
    ko.components.register('MainContent', { 
     template: MCTemplate 
    }); 

    var MainViewModel = { 
     tabArray: [ 
       { name: 'bob', selected: ko.observable(true) }, 
       { name: 'bib', selected: ko.observable(false) }, 
       { name: 'bab', selected: ko.observable(false) }, 
       { name: 'bub', selected: ko.observable(false) }, 
       { name: 'beb', selected: ko.observable(false) }, 
     ] 
    }; 
    ko.applyBindings(MainViewModel); 
    return { 
     viewModel: MainViewModel 
    } 
});

的HTML

<div id="tab"> 

    <ul class="nav nav-tabs" role="tablist"> 
     <!--ko foreach: {data: $parent.tabArray, as: 'tab'}--> 

      <li data-bind="click: tab.selected, css: { 'active': tab.selected}">   
        <a data-bind="attr: {href: '#' + tab.name}, text: name"></a> 
       <div data-bind="text: tab.name"></div> 
       <div data-bind="text: tab.selected"></div> 
      </li> 
     <!--/ko--> 
    </ul> 
    <!--ko foreach: {data: $parent.tabArray, as: 'tab'}--> 
    <div class="ui-tabpanel" role="tabpanel" data-bind="visible: tab.selected"> 
     <p data-bind="text: name"></p> 
    </div> 
    <!--/ko--> 

</div>

來源

2015-08-20 nathan rogers

淘汰賽觀測是可以用於功能獲取/設置支持值。嘗試'tab.selected（）'而不是'tab.selected'。我使用[Knockout-ES5 shim]（http://blog.stevensanderson.com/2013/05/20/knockout-es5-a-plugin-to-simplify-your-syntax/）來解決這個問題。 – CrimsonChris

如果你想閱讀一個observable，你應該像使用方法/函數一樣使用'（）'約定。 –

click的結合呼叫所提供的功能，它通過將當前視圖模型（也稱爲$data）。這就是爲什麼你看到[Object object]作爲點擊後觀察值。既然你想點擊切換觀察點，你需要創建一個函數來做到這一點。一個漂亮，乾淨的方式做到這一點是通過自定義綁定，我會打電話給toggle：

ko.bindingHandlers.toggle = { 
    init: function(element, valueAccessor) { 
     ko.utils.registerEventHandler(element, 'click', function() { 
      var obs = valueAccessor(); 
      obs(!obs()); 
     }); 
    } 
};

現在你綁定使用toggle代替click：<li data-bind="toggle: tab.selected...

來源

2015-08-21 00:27:11

在這種情況下，ko.observable究竟在做什麼？

回答

相關問題