2016-06-13 3 views
0

У меня есть страница профиля в угловых js, после того как я заполнил и отправил их в DB. Затем еще раз, если я вернусь к той же странице профиля, я не получил никаких значений в поле.Как вернуть данные из БД после отправки с клиентской стороны?

profile.html

<form name="profileForm"> 
      <br/> 

       <div flex style="max-width:700px;"> 
        <md-input-container class="md-block"> 
        <label>Name</label> 
        <input ng-model="vm.name"></input> 
       </md-input-container> 
       </div> 

       <div flex style="max-width:700px;"> 
        <md-input-container class="md-block"> 
         <label>Mobile Number</label> 
         <input ng-model="vm.mobile"></input> 
        </md-input-container> 
       </div> 

       <div flex style="max-width:700px;"> 
        <md-input-container class="md-block"> 
         <label>Email</label> 
         <input ng-model="vm.email"></input> 
        </md-input-container> 
       </div> 

       <div flex style="max-width:700px;"> 
       <label>DOB:</label> 
        <md-datepicker ng-model="vm.profileForm.dob" md-placeholder="Enter date"> 
        </md-datepicker> 
       </div> 

       <div flex style="max-width:700px;"> 
        <md-input-container class="md-block" > 
         <label>Country</label> 
         <md-select ng-model="vm.profileForm.Country" ng-change="vm.getCountryStates()"> 
          <md-option ng-repeat="countryName in vm.countries" value="{{countryName.id}}" > 
           {{countryName.country}} 
          </md-option> 
         </md-select> 
        </md-input-container> 
       </div> 

       <div flex style="max-width:700px;"> 
        <md-input-container class="md-block" > 
         <label>State</label> 
         <md-select ng-model="vm.profileForm.State" ng-change = "vm.getStateCities()"> 
          <md-option ng-repeat="stateName in vm.states" value="{{stateName.Id}}"> 
           {{stateName.state}} 
          </md-option> 
         </md-select> 
        </md-input-container> 
       </div> 

       <div flex style="max-width:700px;"> 
        <md-input-container class="md-block" > 
         <label>City</label> 
         <md-select ng-model="vm.profileForm.City"> 
          <md-option ng-repeat="cityName in vm.cities" value="{{cityName.Id}}"> 
           {{cityName.city}} 
          </md-option> 
         </md-select> 
        </md-input-container> 
       </div> 

       <div flex style="max-width:700px;"> 
        <md-input-container class="md-block" > 
         <label>Postal Code</label> 
         <input name="postalCode" ng-model="vm.profileForm.postalCode" ng-pattern="/^[0-9]{6}$/" md-maxlength="6"> 
        </md-input-container> 
       </div> 

       <span style="color:green; font-size:20px;">{{vm.message}}</span> 

       <div layout="row" layout-align="space-between center"> 
        <div> 
         <img src="assets/icons/fonts/backArrow.png" alt="image caption" style="width:18px; height:18px"> 
         <a ng-href ng-click="vm.nextTab()" >Back</a> 
        </div> 
        <div style="margin-right:300px"> 
         <a ng-href="http://localhost:3000/pages/dashboard">Skip</a> 
         <md-button class="md-raised md-primary" ng-click="vm.profileInfo(vm.profileForm);">Save & Continue</md-button> 
        </div> 
       </div> 
      </form> 

profile page

В картине первых 3 значений получение через ngStorage, после заполнения остальных полей данных, хранящихся в БД. Для chekcBox я использовал каскадное выпадающее меню.

profile.js

(function() 
{ 
'use strict'; 

angular 
    .module('app.invite-friends') 
    .controller('InviteFriendsController', InviteFriendsController); 

/** @ngInject */ 
function InviteFriendsController(Friendslist, $localStorage, $scope, $http, $location, CustomerService) 
{ 
    var vm = this; 

    vm.countries = CustomerService.getCountry(); 

    vm.getCountryStates = function(){ 
     vm.states = CustomerService.getCountryState(vm.profileForm.Country);  
     vm.cities =[]; 
    } 

    vm.getStateCities = function(){ 
     vm.cities = CustomerService.getStateCity(vm.profileForm.State); 
    } 

    vm.uid = $localStorage._id; 

    vm.profileInfo = function(userData){ 
     $http({ 
      url:'http://192.168.2.8:7200/api/profile_save', 
      method:'POST', 
      data: {info:userData, loginId:vm.uid} 
     }).then(function(res){ 
      if(res.data.success){ 
       vm.message = 'Your profile information has been saved successfully.'; 
       $location.path('/pages/dashboard') 
      } 
     }, function(error){ 
      alert(error.data); 
     }); 
    }; 

    $http({ 
     url:'http://192.168.2.8:7200/api/checkIfExists', 
     method:'POST', 
     data: {userId: vm.uid} 
    }).success(function(res){ 
     vm.name = res.result[0].name; 
     vm.mobile = res.result[0].mobile; 
     vm.email = res.result[0].email; 
     vm.DOB = res.result[0].DOB; 
     vm.Country = res.result[0].Country; 
     vm.State = res.result[0].State; 
     vm.City = res.result[0].City; 
     vm.postalCode = res.result[0].PostCode; 
    }, function(error){ 
     alert(error.data); 
    }); 
    } 
    })(); 
+0

Вы можете разместить свой угловой код? –

+0

Есть ли какой-нибудь код для извлечения данных? Если да, можете ли вы опубликовать его, чтобы мы могли отлаживать? Если нет, необходимо выполнить поиск данных, чтобы вы могли его отобразить. –

+0

Да, я добавил к моему вопросу угловой код. – Kevin

ответ

0

Все, нг-модель получает или обновления данных в vm.profileForm в окне, где, как, когда вы данные настройки для просмотра формы контроллер, добавляемого свойства Vm, не vm.profileForm

Изменение следующий код в $ HTTP успеха от

vm.DOB = res.result[0].DOB; vm.Country = res.result[0].Country; vm.State = res.result[0].State; vm.City = res.result[0].City; vm.postalCode = res.result[0].PostCode;

в

vm.profileForm.dob = res.result[0].DOB; vm.profileForm.Country = res.result[0].Country; vm.profileForm.State = res.result[0].State; vm.profileForm.City = res.result[0].City; vm.profileForm.postalCode = res.result[0].PostCode;

+0

ha yes Я добавил свойства vm только в контроллер, но где я могу посмотреть, потому что ng-model уже имеет значение. – Kevin

+0

Вы должны установить vm.profileForm.dob vm.DOB в contorller. Потому что вы использовали vm.profileForm.dob в представлении. Аналогичным образом вы должны установить для страны, штата, города – John

+0

Теперь у меня есть значения в контроллере из БД, теперь как мне отправлять значения для просмотра? – Kevin

Смежные вопросы