loops - KnockoutObservableArray of type button that has action property doesnt assign action correctly -


i'm creating dynamic popup dynamic buttons have problem when use actions.

button's creation code :

openpopup = (buttons: array<popupbuttonsmodel>, title?: string, description?: string) => {     var self = this;     self.popup().isvisible(false);     var action: any;     (var i: number = 0; < buttons.length; i++) {         action = buttons[i].action;         var button = popuphelper.createpopupbutton(buttons[i].text ? buttons[i].text : "tamam",             action ? function () { action; self.popup().isvisible(false); } : function () { self.popup().isvisible(false); });         buttons[i] = button;     }     self.popup(popuphelper.createpopup(buttons, title, description)); } 

when click button debugger shows me action's value (and undefined)

buttons[i].action // should {alert('example');} 

this code shows buttons correctly actions wrong. if give action undefined button works correctly "function () { self.popup().isvisible(false); });" because of condition.

my view :

 <!-- ko if:popup().isvisible--> <div class="loader-container popup-dialog">     <div class="panel panel-success modal-dialog">         <div class="panel-heading">{{popup().title}}</div>         <div class="panel-body">{{popup().description}}</div>         <div data-bind="foreach:popup().buttons" class="panel-footer">             <button data-bind="click:$data.action">{{$data.text}}</button>         </div>     </div> </div> <!--/ko--> 

popup variable @ viewmodel is:

import popupmodel = require('models/popup'); public popup: knockoutobservable<popupmodel> = ko.observable<popupmodel>(new popupmodel()); 

popupmodel:

import popupbuttons = require('models/popup-buttons'); class popupmodel { buttons: knockoutobservablearray<popupbuttons> = ko.observablearray<popupbuttons>([]); isvisible: knockoutobservable<boolean> = ko.observable(false); title: knockoutobservable<string> = ko.observable(""); description: knockoutobservable<string> = ko.observable(""); } export = popupmodel; 

popupbuttonmodel:

class popupbuttons { action: any; text: string; } export = popupbuttons; 

popup-helper:

import popupbuttons = require('models/popup-buttons'); 

import popupmodel = require('models/popup'); class popupmanager { public static createpopup(buttons: array, title?: string, description?: string) { var popup: popupmodel = new popupmodel(); popup.buttons(buttons); popup.title(title ? title : "hata"); popup.description(description ? description : "İşleminizi şu gerçekleştiremiyoruz,lütfen tekrar deneyiniz."); popup.isvisible(true); return popup; }

public static createpopupbutton(text?: string, action?: any) {     var button: popupbuttons = new popupbuttons();     button.text = text;     button.action = action;     return button; }  public static hidepopup(popup: popupmodel) {     popup.isvisible(false); } }  export = popupmanager; 


Comments

Popular posts from this blog

html - Styling progress bar with inline style -

java - Oracle Sql developer error: could not install some modules -

How to use autoclose brackets in Jupyter notebook? -