从Angular控制器

时间:2016-06-15 19:30:53

标签: angularjs sql-server asp.net-mvc

我是AngularJS的新手,请接受我的道歉,如果这是一个简单的问题。我也希望问题的标题是可以理解的?

我正在使用带有ASP.Net MVC应用程序的AngularJS来准备来自SQL服务器表的数据,然后在视图上显示数据。一切都很好但是当我尝试前进更高级的任务时,我发现我无法从Angular模块中读取对象。

例如,我想阅读用户的联系方式,每个用户都有不同数量的联系人。所以,ng-repear limitTo不应该是相同的。为此,我想读取一些数据,然后将变量设置为我在数据库中找到的项目数,然后在ng-repear limitTo

中使用该变量

这是我观点的一部分:

<table>
<tr ng-repeat="contact in users | limitTo:loopVar">
    <td>
        <div ng-show="!contactsElements" class="item_list">{{contact.contacts + " (" + contact.contactDesc + ")"}}</div>
    </td>
</tr>

loopView是我想要使用的变量

这是Angular模块/控制器:

var myApp = angular.module('myApp', []);

myApp.controller('mainController', function ($scope, $http) {
$http.get('/Home/GetUser')
    .success(function (result) {
        $scope.users = result;
    })
    .error(function (data) {
        console.log(data);
    });

\\HOW I CAN SET THE loopVar HERE SO I CAN USE IT IN MY VIEW??
}

MVC控制器如下:

public JsonResult GetUser()
    {
        User userData = (User)Session["user"];            
        var db = new testDBEntities();
        return this.Json((from userObj in db.Users
                          join uc in db.UserContacts
                          on userObj.Id equals uc.usrID
                          join us in db.Users
                          on userObj.usrSupervisor equals us.Id
                          where userObj.Id.Equals(userData.Id)
                          select new
                          {
                              Id = userObj.Id,
                              usrNme = userObj.usrNme,
                              fName = userObj.usrFirstName,
                              lName = userObj.usrLastName,
                              ssno = userObj.usrSSN,
                              contacts = uc.usrContact,
                              contactDesc = uc.usrContactDescription,
                          })
                          , JsonRequestBehavior.AllowGet
                        );
    }

我希望你理解我的观点...一般来说,在我的视图中使用它之前,如何在Angular控制器中读取返回的JSON对象?如您所见,我可以使用ng-repeat指令在视图中读取数据,但我不知道如何在Angular控制器中准备单个字段。

谢谢

1 个答案:

答案 0 :(得分:1)

返回的数据对象是按照您在控制器JsonResult中指定的方式格式化的。

从控制器GetUser函数传递数组中的每一个

$http.get('/Home/GetUser')
    .success(function (result) {
        $scope.users = result;

        //Loop the json
        if (result != null) {
            for (var i = 0; i < result.length; i++) {

                //Then you get the values like this

                //result[i].Id; 
                //result[i].usrNme; 
                //result[i].fName; 
                //result[i].lName; 
                //result[i].ssno; 
                //result[i].contacts; 
                //result[i].contactDesc; 

                }
        }

    })
    .error(function (data) {
        console.log(data);
    });

如果您只想将一个值从控制器发送到JsonResult,您可以这样做

假设您在控制器中有一个方法调用GetLoopVar():

public JsonResult GetLoopVar()
{
    string loopVar = "Im a var";
    return Json(loopVar, JsonRequestBehavior.AllowGet)
}

并在您的客户

$http.get('/Home/GetLoopVar')
    .success(function (result) {

        $scope.loopVar = result;

        //$scope.loopVar = "Im a var"

    })
    .error(function (data) {
        console.log(data);
    }); 

要结合这两者并在此实现目标,我首先要确保设置了过滤器中使用的范围值。 设置loopVar后,获取用户。 一种方法是在设置loopVar值之后调用getUsers函数,就像这样

myApp.controller('mainController', function ($scope, $http) {

    $scope.getLoopVar = function(){
        $http.get('/Home/GetLoopVar')
            .success(function (result) {
                $scope.loopVar = result;

                //Call get user function
                $scope.getUsers();
            })
            .error(function (data) {
                console.log(data);
            });
    };

    $scope.getUsers = function(){
        $http.get('/Home/GetUser')
            .success(function (result) {
                $scope.users = result;
            })
            .error(function (data) {
                console.log(data);
            });
    };

    //To get the values on load, call the $scope.getLoopVar() in the controller
    $scope.getLoopVar();
}