Angularjs ng-model没有从json填充

时间:2017-12-19 22:17:48

标签: javascript angularjs json

我从角度服务获得的JSON数据没有填充ng-model。我尝试将数据放在警告框中,例如alert(data.Usr_UserId),但它在警告框中显示undefined。以下是我的代码。

1)控制器

app.controller(" myCtrl",函数($ scope,myService,$ mdDialog){

GetAllEmployee();
//To Get All Records  
function GetAllEmployee() {
    var result = myService.getEmployees();
    result.then(function (data) {
        $scope.userlist = data.data;
    });
}
GetUserTypeList();
//To Get All Records  
function GetUserTypeList() {
    var result = myService.getUserType();
    result.then(function (data) {
        $scope.usertype = data.data;
    });
}
$scope.clickevent = function(user, item) {
    if (item.opType == 1) {
        edit();
        ListEmp(user);
    } else {
        deleteEmp(user);
    }
}    
function deleteEmp(user) {
    var getData = myService.DeleteEmp(user.Usr_Id);
    getData.then(function(msg) {
      alert('Employee Deleted');
        GetAllEmployee();
    }, function() {
        alert('Error in Deleting bbb');
    });
}  
function ListEmp(user) {
    var resultset = myService.getEmp(user.Usr_Id);
    resultset.then(function(data) {
        alert(data.Usr_UserFName);
        $scope.add_user.UserId = data.Usr_UserId;
        $scope.add_user.FirstName = data.Usr_UserFName;
        $scope.add_user.LastName = data.Usr_UserLName;
        $scope.add_user.phone = data.Usr_PhoneNum;
        $scope.add_user.UserType = data.Usr_Type;
        $scope.add_user.Password = data.Usr_Passowrd;
    });
}
$scope.AddUser = function (add_user) {
    var getData = myService.AddEmp(add_user.Usr_UserId, add_user.Usr_Passowrd, add_user.Usr_UserFName, add_user.Usr_UserLName, add_user.Usr_Type, add_user.Usr_PhoneNum);
    window.location.href = '/Home/UserList';
    GetAllEmployee();       
}})
.controller('WidthDemoCtrl', function ($mdDialog) {
var vm = this;

this.announceClick = function (index) {
    $mdDialog.show({
        controller: DialogCtrl,
        controllerAs: 'ctrl',
        templateUrl: '/Home/About',
        parent: angular.element(document.body),
        targetEvent: $event,
        clickOutsideToClose: true
    })
};})

2)Service.js

app.service("myService", function($http) {
  //get All Users
  this.getEmployees = function() {
    return $http.get("/Home/GetAllUsers");
  };
  this.getEmp = function(employeeId) {
    var response = $http({
      method: "post",
      url: "/Home/GetUserById",
      data: JSON.stringify({
        Userid: employeeId
      })
    });
    return response;
  }
  this.DeleteEmp = function(employeeId) {
    var response = $http({
      method: "post",
      url: "/Home/DeleteUser",
      data: JSON.stringify({
        User: employeeId
      })
    });
    return response;
  }
  this.AddEmp = function(userid, password, fname, lname, type, phone) {
    var response = $http({
      method: "post",
      url: "/Home/AddNewUser",
      data: JSON.stringify({
        UserId: userid,
        UserPassword: password,
        UserFName: fname,
        UserLName: lname,
        UserType: type,
        UserPhoneNumber: phone
      })
    });
    return response;
  }
  this.getUserType = function() {
    return $http.get("/Home/GetUserType");
  };
})

3)CSHTML

<div ng-controller="myCtrl" layout="column" ng-cloak class="md-inline-form">
   <md-content layout-padding>
      <div>
         <form name="userForm">
            <div layout-gt-xs="row">
            </div>
            <div layout-gt-sm="row">
               <md-input-container class="md-block" flex-gt-sm>
                  <label>User Id</label>
                  <input ng-model="add_user.UserId"  ng-required="true">
               </md-input-container>
               <md-input-container class="md-block" flex-gt-sm>
                  <label>Password</label>
                  <input ng-model="add_user.Password" type="password" ng-required="true">
               </md-input-container>
            </div>
            <div layout-gt-sm="row">
               <md-input-container class="md-block" flex-gt-sm>
                  <label>First Name</label>
                  <input ng-model="add_user.FirstName"  ng-required="true">
               </md-input-container>
               <md-input-container class="md-block" flex-gt-sm>
                  <label>Last Name</label>
                  <input ng-model="add_user.LastName"  ng-required="true">
               </md-input-container>
            </div>
            <div layout-gt-sm="row">
               <md-input-container class="md-block" flex-gt-sm>
                  <label>Phone</label>
                  <input ng-model="add_user.phone"  ng-required="true">
               </md-input-container>
               <md-input-container class="md-block" flex-gt-sm>
                  <label>User Type</label>
                  <md-select ng-model="add_user.UserType"  ng-required="true">
                     <md-option ng-repeat="type in usertype" value="{{type.Ut_int}}">
                        {{type.Ut_Name}}
                     </md-option>
                  </md-select>
               </md-input-container>
            </div>
            <div>
               <md-button ng-click="AddUser(add_user)" type="submit" class="md-raised md-primary">Submit</md-button>
            </div>
         </form>
      </div>
   </md-content>
</div>
<pq-grid options=""></pq-grid>

1 个答案:

答案 0 :(得分:0)

使用以下属性检查服务返回的json属性 Usr_UserId Usr_UserFName Usr_UserLName Usr_PhoneNum Usr_Type Usr_Passowrd