0
로그인 화면이 있습니다. 화면에 사용자가 로그인 한 후 대시 보드 상단에 사용자 이름을 표시하고 싶습니다. knockout js를 사용하여 this.below를 사용하고 있습니다. 내 스크립트와 html입니다. 코드knockout js로 사용자 로그인 후 사용자 이름 표시
var LoginViewModel = function (parantModel) {
var self = this;
self.userName = ko.observable();
self.password = ko.observable();
self.submit = function() {
parantModel.dashboardViewModel.uId= self.userName;
navigationService.navigateTo($('#dashBoardPage'));
}
}
var DashboardViewModel = function(){
var self = this;
self.uId = ko.observable();
}
function PageViewModel(){
var self = this;
self.loginModel = new LoginViewModel(self);
self.dashboardViewModel = new DashboardViewModel(self);
}
function NavigationService(){
var self = this;
self.navigateTo = function(pageId){
$.mobile.changePage(pageId);
};
}
var navigationService = new NavigationService();
ko.applyBindings(new PageViewModel());
HTML
<div data-role="page" data-theme="a" id="loginPage" data-bind="with:loginModel">
<div data-role="content">
<p>
<input type="text" class="input" placeholder="username" data-bind="value: userName"/>
<input type="password" class="input" placeholder="Password" data-bind="value: password"/>
</p>
<p>
<button data-bind='click: submit'>Login</button>
</p>
</div>
</div>
<div data-role="page" data-theme="a" id="dashBoardPage" data-bind="with:dashboardViewModel">
<div data-role="content">
<label>User Id<span data-bind="text:uId"></span></label>
</div>
</div>
코드에서
제거 사용자 로그인 검증, 작업 예를 http://jsfiddle.net/uderox/gY9Nt/2/
* 부모 * parant하지 ... – Tanner