Create ko.observableArray from JSON Object in knockout

16,526

Try declaring ( where you have the // Data )

self.allEntries = ko.observableArray([]);

then in the load...

self.allEntries(result.feed.entries);
Share:
16,526
Maxali
Author by

Maxali

Updated on July 29, 2022

Comments

  • Maxali
    Maxali almost 2 years

    I just started using knockout.js and it works great with normal bidings. I have a problem with observableArray.

    I want to create an observableArray and assign to it a JSON data from Google Feed API. Here is the JSON format https://developers.google.com/feed/v1/devguide#resultJson

    google.load("feeds", "1");  // Loads Google Feed API
    function FeedViewModel()
    {
        // Data
        var self = this;
        self.allEntries = null;
    
        // Example property, and it works
        self.feedHead = ko.observable("BBC News");
    
        var feed = new google.feeds.Feed("feeds.feedburner.com/BBCNews");
        feed.setResultFormat(google.feeds.Feed.JSON_FORMAT);
        feed.includeHistoricalEntries();
        feed.setNumEntries(30);
    
        // Loads feed results
        feed.load(function (result) {
            if (!result.error) {           
                self.allEntries = ko.observableArray(result.feed.entries);
    
                // accessing the title from here is OK
                alert(self.allEntries()[1].title);
            }        
        });
    }
    

    In the above example, accessing the array from the ViewModel is OK but I need to display it in the view (to the browser) using foreach:allEntries

    <h2 data-bind="text: feedHead">Latest News</h2>
    <!-- ko foreach:allEntries -->
        <div class="lists">
            <a href="#" data-bind="text: title"></a>
        </div>
    <!-- /ko -->
    

    But nothing the ko foreach loop returns nothing. The observable feedHead is OK.

    Also I dont have any JS error. Any help..