gpt4 book ai didi

angularjs - Angular Route - 加载时调用函数

转载 作者:行者123 更新时间:2023-12-02 10:22:03 25 4
gpt4 key购买 nike

我正在使用 $routeProvider 将我的所有应用页面路由到相关的 Controller ,但是当两个路由使用相同的时> Controller (即/blog &/blog:id)如何根据当前路由初始化单独的函数

因此,如果路由是/blog,我想在路由加载时初始化 $scope.loadPosts() 。如果路线是/blog:id 我想在路线加载时初始化 $scope.loadPost($id) 。

最佳答案

您可以在这里做一些事情,但我的建议是通过路由解析来传递初始化函数。你可以这样做:

angular.module('test', ['ngRoute'])
.config(['$routeProvider',
function($routeProvider) {
$routeProvider
.when('/blog', {
controller: 'BlogController',
template: '<h1>Blog</h1>',
resolve: {
init: function() {
return function() {
console.log('Loading Blog');
}
}
}
})
.when('/blog/:id', {
controller: 'BlogController',
template: '<h1>Blog ID</h1>',
resolve: {
init: function() {
return function($route) {
console.log('Loading Blog Article ' + $route.current.params.id);
}
}
}
});
}
])
.controller('BlogController', ['$scope', '$route', 'init',
function($scope, $route, init) {
init($route);
}
]);
<!DOCTYPE html>
<html ng-app="test">

<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.7/angular.min.js"></script>
<script src="https://code.angularjs.org/1.4.6/angular-route.js"></script>

</head>

<body>
<a href="#/blog">Go to Blog</a>
<a href="#/blog/2">Go to Article 2</a>

<div ng-view></div>
</body>

</html>

其他一些选项是:

  • 解决某种指示器,您可以在 Controller 内的初始化函数中打开开关
  • 如果您正在加载博客路由,请解析 undefined object ;如果您正在加载 blog:id 路由,请解析您将为该路由加载的实际项目

希望这段代码能让您开始走上正确的道路,无论您做出什么决定。

编辑这是一个link to a plunker ,代码片段似乎间歇性地表现得很奇怪

关于angularjs - Angular Route - 加载时调用函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33404796/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com