Question

我是AngularJS的新手。所以我有一个简单的问题，但我无法找到答案。我有代码：

angular.module('app', ['app.controllers', 'ngRoute']).
config(['$routeProvider', function ($routeProvider) {
    $routeProvider.when('/users', {templateUrl: '../pages/list.html', controller: 'UserListCtrl'}).
        when('/user-details/:login', {templateUrl: '../pages/form.html', controller: 'UserCtrl'  /* and here I need to call userDetails(login) from UserCtrl */}).
        otherwise({redirectTo: '/users'});;
}
]);

app.controller('UserCtrl', function ($scope, $http, $location) {
$scope.userDetails = function (login) {
    $http.get(url + login).success(function (data) {
        $scope.user = data[0];
        console.log('tst');
    }).error(errorCallback);
};

$scope.createUser = function (user) {
    $http.post(url, user).success(function (data) {
        $location.path('/users');
    }).error(errorCallback);
};
});

我的问题是：在路由匹配时，我不知道如何调用控制器的特定方法。我需要调用方法并给它参数：从路由登录。怎么解决这个？谢谢你的回答

Answer 1

如果我理解正确，您将为视图的两个部分（或两个视图）重复使用相同的控制器，一个用于创建用户，另一个用于获取当前用户的详细信息。

由于这两个方面完全不同，因此不建议对两者使用相同的控制器。控制器应该是不同的，任何通用或可重用的功能都应该通过服务共享。

在任何情况下，调用后端的代码都应该不放在控制器内，而是置于服务中。 E.g：

app.service('UserSrv', function ($http) {
    var url = '...';
    this.userDetails = function (login) {
        return $http.get(url + login);
    };
    this.createUser = function (user) {
        return $http.post(url, user);
    };
});

app.controller('UserCtrl', function ($scope, UserSrv) {
    var login = '...';
    var errorCallback = ...;

    // Fetch user details upon initialiation
    UserSrv.userDetails(login).success(function (data) {
        $scope.user = data[0];
    }).error(errorCallback);
});

app.controller('NewUserCtrl', function ($location, $scope, UserSrv) {
    var errorCallback = ...;

    $scope.createUser = function (user) {
        UserSrv.createUser(user).success(function (data) {
            $location.path('/users');
        }).error(errorCallback);
    };
});

您还可以使用$routeProvider resolve属性来预先加载＆＃34;预加载＆＃34;用户的详细信息，并将其作为参数传递给UserCtrl。

$ routeProvider里面的AngularJS调用方法

1 个答案: