user2952571
user2952571

Reputation: 3

KnockOut Unable to parse bindings. ReferenceError

Error: Unable to parse bindings. Message: ReferenceError: message is not defined; Bindings value: text: message.

I couldn't figure out why the binding is failing.

Below is the javascript code:

    var LogItemModel = function () {
        var self = this;

        function LogItem($root, appName, level, message) {
            self.appName = ko.observable(appName);
            self.level = ko.observable(level);
            self.message = ko.observable(message);
        }

        self.logItems = ko.observableArray();

        self.add = function (appName, level, message) {
            self.logItems.push(new LogItem(self, appName, level, message));
        };
    };


    $(document).ready(function () {
        var logItemModel = new LogItemModel();
        ko.applyBindings(logItemModel);
        var url = "http://localhost:49091/api/Log";

        $.getJSON(url, function (result) {
            $.each(result, function (idx, logItem) {
                logItemModel.add(logItem.ApplicationName, logItem.Level, logItem.Message);
                debugger;
            });
        }).error(function (e) {
        });

    });

Below is the html code:

<div id="LogItemList" data-bind="foreach:logItems">
    <span data-bind="text: message"></span>
</div>

I even tried applying binding to LogItemList element as

ko.applyBindings(logItemModel, $("#LogItemList")[0]);

But even this didn't work.

Upvotes: 0

Views: 2281

Answers (1)

edotassi
edotassi

Reputation: 476

function LogItem($root, appName, level, message) {
    self.appName = ko.observable(appName);
    self.level = ko.observable(level);
    self.message = ko.observable(message);
}

in this function self is referenced in LogItemModel, change it so:

function LogItem($root, appName, level, message) {
    var that = this;
    that.appName = ko.observable(appName);
    that.level = ko.observable(level);
    that.message = ko.observable(message);
}

Upvotes: 2

Related Questions