Question

我需要用从web api

检索的数据填充select元素

我为web api使用属性路由

api/project/{pid}/users

它工作正常，如果传递参数pid manualy。

我需要使用angular $ http.get（）

通过查询字符串传递参数

我试过这个

this.getItems = function () {
   return $http({
        url: '/api/project/{pid}/users',
        method: 'GET',
        data: $.param({pid:123})
    });

}

在小提琴手中我遇到404错误。

http://localhost/api/project/%7Bpid%7D/users

我读了$ location。$ Search和$ routParam，但我需要额外的帮助。

Answer 1

Angular不会解析字符串并在视图中替换{pid}，所以你可以这样做：

this.getItems = function () {
   return $http({
        url: '/api/project/' + pid + '/users',
        method: 'GET'
    });
}

甚至更短：

this.getItems = function () {
   return $http.get('/api/project/' + pid + '/users');
}

Answer 2

“手动传递pid”是什么意思？

我要求你的html中有ng-click="getItems()"之类的东西。您可以将其更改为ng-click="getItems(pid)"并将其传递给您的函数

this.getItems = function (pid) {
   return $http.get('/api/project/' + pid + '/users');
}

params选项会将搜索对象添加到您的网址末尾，如

?users=jondoe

更新

查看新代码，一切看起来都不错。但是你的HTML应该是

<select ng-model="user" ng-options="item.id as item.name for item in users" ng-click="getUsers(item.id)">

此外，该功能应该是

$scope.getUsers(pid) {
                dataFactory.getUsers(pid)
                    .success(function (user) {
                        $scope.users = user;
                    })
                    .error(function (error) {
                        $scope.status = error.message;
                    });
            }'

Answer 3

当用户在select元素中选择精确选项时，我需要调用控制器函数。

Angular Service：

dataFactory.getUsers = function (pid) {
            return $http.get(urlBase + 'api/projects/project/' + pid +'/users');

角度控制器：

function getUsers(pid) {
                dataFactory.getUsers(pid)
                    .success(function (user) {
                        $scope.users = user;
                    })
                    .error(function (error) {
                        $scope.status = error.message;
                    });
            }'

HTML：

<select ng-model="user" ng-options="item.id as item.name for item in users" ng-click="getUsers(pid)">

根据查询字符串参数使用Angular填充select元素

3 个答案: