.then中的函数无法识别参数

Question

What I am trying to achieve is a dropdown list that produces lisof Metacategories. Once the user selects the meta category, the parameter should be passed onto the URI of the function present in $scope.meta().then(...). however, the parameter I am passing is category; ng-model="category". This parameter is not sent to the URI, I am getting an error:

TypeError: Cannot read property 'category' of undefined

HTML:

 </select></center >
<center> <select ng-model="category"  > <!-- This produces drop down list from which the users selects a category which should then get passed to the meta1() function as a parameter to produce a further list for the drop down after that-->
<option size=50 value="" selected>Select a meta category</option>
 <option ng-repeat="meta in metas.metas" value="{{meta}}">{{meta}} </option>

</select></center>
<center> <select ng-model="category"  >
<option size=50 value="" disabled selected>Select a category</option>
 <option ng-repeat="category in categories.categories" value="{{category}}">{{category}} </option>

 </select></center>

Angular:

myApp.config(['$routeProvider', function($routeProvider) {
$routeProvider.when('/post', {
    templateUrl: 'templates/post.html',
    controller: 'PostCtrl'
})
}])
.controller('UserListCtrl', function ($scope, $http) {
$scope.list = function () { // this gets the list of places which works completely fine.
    $http.get('http://94.125.132.253:8001/getuncategorisedplaces').success(function (data) {

        $scope.places = data;
        console.log(data);
        $scope.message = 'List of Uncategorised places';
        $scope.meta = function () { // this gets list of meta categories, which is working fine.
            return $http.get('http://94.125.132.253:8000/getmetas').success(function (data) {

                $scope.metas = data;
                console.log(data);
                $scope.message = 'List of Uncategorised places';
            })
        }

// the function below should get a parameter category from previous function which is selected in HTML. Once this happens, the parameter category should be passed on as formdata.category(below) which will get the list of categories.

        $scope.meta().then(function (data) {
            var formdata = {
                'category': this.category,
            }
            var inserturl = 'http://94.125.132.253:8000/getcategories?meta=' + formdata.category;
            $http.get(inserturl).success(function (data) {

                $scope.categories = data;
                console.log(formdata.category);
                console.log(data);
                $scope.message = 'List of Uncategorised places';
            });


        });
    })
}
$scope.list();

Answer 1

I would think that the error is caused by this:

$scope.meta().then(function meta1($scope,$http) {

because the meta method is not returning a promise. The meta method could return a promise if you did this:

$scope.meta= function(){
  return $http.get('http://94.125.132.253:8000/getmetas').success(function (data) {
    $scope.metas = data;
    console.log(data);
    $scope.message = 'List of Uncategorised places';
    return data;
  });
};

and you could change the call to meta to this

$scope.meta().then(function(data) {
...
}

Answer 2

Missing return .

$scope.meta should return a promise for you to be able to use .then()

$scope.meta= function(){
    return $http.get('http://94.125.132.253:8000/getmetas').success(function(...
        ...
}

$scope.meta().then(function (data) {
    // do something with data
});