ngTagsInput没有从angular $http中填充

Question

我是一个完全的angularjs新手。所以我希望我能在某种程度上走上正轨。

我有一个配置为

的数据上下文

(function () {
'use strict';
var serviceId = 'datacontext';
angular.module('app').factory(serviceId, ['common', '$http', datacontext]);
function datacontext(common, $http) {
    var $q = common.$q;
    var service = {
        getCustomerGroups: getCustomerGroups
    };
    return service;

    function getCustomerGroups() {
        var groups = [];
        $http({ method: 'GET', url: '/api/getgroups' }).
                success(function (data, status, headers, config) {
                        console.log(status);
                        console.log(headers);
                        console.log(data);
                        groups = data;
                        return $q.when(groups);
            }).
error(function (data, status, headers, config) {
    console.log(data);
    // called asynchronously if an error occurs
    // or server returns response with an error status.
});
          return $q.when(groups);
    }
}
})();

在我的视图中，我使用的是ngTagsInput

                        <tags-input ng-model="groups"
                                display-property="GroupName"
                                placeholder="Add Customer Group"
                                enableeditinglasttag="false"
                                class="ui-tags-input"
                                replace-spaces-with-dashes="false">
                    </tags-input>

最后是控制器

(function () {
'use strict';
var controllerId = 'customers';
angular.module('app').controller(controllerId, ['common','$scope','$http','datacontext', customers]);
function customers(common,$scope,$http,datacontext) {
    var vm = this;
    vm.title = 'Customers';
    $scope.groups = [];

    function getGroups() {
        return datacontext.getCustomerGroups().then(function (data) {
            return $scope.groups = data;
        });
    }
    activate();
    function activate() {
        var promises = [getGroups()];
        common.activateController(promises, controllerId)
            .then(function() {
            }
       );
    }

}
})();

我没有得到任何错误，我可以看到正确的数据在$http的成功方法返回。然而，标签没有被填充。是因为标签在$http完成之前调用数据源吗?

Answer 1

我不知道$q。When工作，但是它返回promise但不解决它。你应该使用defer api。

所以在开始时设置

var defer = common.$q.defer();

和之后的成功执行defer.resolve.

 success(function (data, status, headers, config) {
                        console.log(status);
                        console.log(headers);
                        console.log(data);
                        groups = data;
                        defer.resolve(data);