我是 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);
};
});
我的问题是:我不知道当路由匹配时如何调用 Controller 的特定方法。我需要调用方法并为其提供参数:来自路由的登录。怎么解决这个问题呢? 谢谢您的解答
最佳答案
如果我理解正确,您将在 View 的两个部分(或两个 View )中重复使用相同的 Controller ,一个用于创建用户,另一个用于获取当前用户的详细信息。
由于这两个方面完全不同,因此不建议两者使用相同的 Controller 。 Controller 应该不同,并且任何通用或可重用的功能都应该通过服务共享。
无论如何,调用后端的代码不应放置在 Controller 内,而应放置在服务中。例如:
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
属性“预加载”用户的详细信息并将其作为参数传递给 UserCtrl。
关于javascript - $routeProvider 中的 AngularJS 调用方法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24340629/