I am trying to show new announcements on top & drop off expired announcements from UI using knockoutjs. Being a newbie to knockout, i'm stuck here and unable to move further. here's a piece of code which needs some correction. Appreciate any pointers to resolve this issue. and on the UI, I am using data bind="foreach: items, as: 'item'" to ul element.
- function ItemViewModel(params)
- {
- this.text = ko.observable(params.title);
-
- this.link = ko.observable(params.path);
- this.cssClass = ko.observable("");
- }
- function viewModel(params)
- {
- var self = this;
- this.isLoading = ko.observable(true).extend({ throttle: 250 });
- this.studio = ko.observable(params.studio || "");
- this.maxItems = ko.observable(params.maxItems || 8);
- this.items = ko.observableArray([]);
- this.dialogId = ko.observable('AnnouncementsModal');
- this.addItem = function (item, e)
- {
- navigationService.navigateTo('/Announcements/NewForm.aspx', true);
- e.preventDefault(); };
- this.canAddItem = ko.computed(function()
- {
- var isLeader = contextService.isLeader();
- var isContributor = contextService.isContributor();
- return isLeader || isContributor; }, this);
- this.hasNoItems = ko.computed(function()
- {
- var items = self.items();
- return items.length === 0;
- }, this).extend({ throttle: 250 });
- this.searchTerm = ko.computed(function ()
- {
- var studio = contextService.studio();
- if (studio)
- {
- return studio;
- }
- return self.studio();
- });
- ko.computed(function ()
- {
- var maxItems = self.maxItems();
- var term = self.searchTerm();
- if (term == null || term === "")
- return null;
- self.isLoading(true);
- console.log('announcements-webpart/vm.js: data-service load...');
- dataService.studios.announcements(term, maxItems) .done(function (result)
- {
- console.log('announcements-webpart/vm.js: data-service load completed.');
- self.isLoading(false);
- self.items.removeAll();
- if (result.items)
- {
- for (var i = 0; i < result.items.length; i++)
- {
- if (i >= maxItems) return;
- var item = new ItemViewModel(result.items[i]);
- self.items.push(item);
- }
- }
- }); return null;
- }, this).extend({ deferred: true });
- }
- viewModel.prototype.dispose = function () { };
- return viewModel; })();