Question

如何在我的应用程序中为每个控制器实例使用不同的初始化变量集？

在视图中：

<div ng-controller="showProjectList">
{{project_list}}<!--user 1-->
</div>

<div ng-controller="showProjectList">
{{project_list}}<!--user 2-->
</div>

控制器中的

myapp.controller('showProjectList',function($http)
{ $scope.project_list= <Here I have a http request with argument user_id to fetch project_list>
}

现在如何使用不同的user_id初始化每个控制器？我已经阅读过一个解决方案stackexchange＆amp;在google-groups上使用ng-init。（链接google-grp：https://groups.google.com/forum/#!topic/angular/J6DE8evSOBg）。但是，在同一个帖子中提醒使用ng-init。那么如何使用数据初始化控制器呢？

Answer 1

您可以结合使用控制器，指令和服务。

控制器持有用户ID。

该指令正在呈现项目列表。

该服务负责从服务器获取数据。您可以在此处实现缓存和/或使用$resource。

以下是模板代码：

<div ng-controller="Projects">
    <!-- here you can put an input element with
         ng-model="users" to modify the user list on the fly -->
    <div ng-repeat="user in users">
        <project-list user="user" />
    </div>
</div>

控制器：

myapp.controller('Projects', ['$scope', function($scope) {
    $scope.users = [1, 2, 3];
}]);

指令：

myapp.directive('projectList', ['UserService', function(UserService) {
    return {
        restrict: 'E',
        scope: {
            user: "="
        },
        templateUrl: 'project-list.html',
        link: function($scope, $element, $attrs) {
            UserService.getUserProject($scope.user).then(function(response) {
                $scope.userProjects = response;
            });
        }
    };
}]);

服务：

myapp.factory('UserService', ['$http', function($http) {
    var getUserProject = function(user) {
        var promise = $http.get('users/' + user + '/project');
        return promise;
    }

    return {
        getUserProject: getUserProject
    }
}]);

使用角度不同的数据集初始化控制器实例

1 个答案: