Angularjs 角度路由-加载时调用函数_Angularjs

Angularjs 角度路由-加载时调用函数

angularjs

Angularjs 角度路由-加载时调用函数,angularjs,Angularjs,我正在使用$routeProvider将我的所有应用程序页面路由到相关的控制器，但是当两个路由使用相同的控制器（即/blog&/blog:id）时，我如何根据当前的路由初始化单独的功能 angular.module('demo', ['ngRoute']) .config(['$routeProvider', function($routeProvider) { $routeProvider .when('/linkOne', { controller: 'L

我正在使用

$routeProvider

将我的所有应用程序页面路由到相关的

控制器

，但是当两个

路由

使用相同的

控制器

（即/blog&/blog:id）时，我如何根据当前的

路由

初始化单独的

功能
angular.module('demo', ['ngRoute'])
 .config(['$routeProvider',
   function($routeProvider) {
    $routeProvider
    .when('/linkOne', {
      controller: 'LinkController',
      template: '<h1 ng-init="functionOne()">Hello world</h1>'
    })
    .when('/linkTwo', {
      controller: 'LinkController',
      template: '<h1 ng-init="functionTwo()">Hello Stackoverflow</h1>'
    });
 }])
 .controller('LinkController', ['$scope', function($scope) {
  $scope.functionOne = function(){
    console.log("Hello");
  }
  $scope.functionTwo = function(){
    console.log("Hello world");
  }
 }]);

因此，如果路由是/blog，我希望在路由加载时初始化$scope.loadPosts（）。
如果路由为/blog:id，我想在路由加载时初始化$scope.loadPost（$id）。
您可以在这里做一些事情，但我的建议是通过路由解析来传递初始化函数。你可以这样做：

angular.module（'test'，['ngRoute']））
.config（[“$routeProvider”，
函数（$routeProvider）{
$routeProvider
.when（“/blog”{
控制器：“BlogController”，
模板：“博客”，
决心：{
init:function（）{
返回函数（）{
log（'Loading Blog'）；
}
}
}
})
.when（“/blog/：id”{
控制器：“BlogController”，
模板：“博客ID”，
决心：{
init:function（）{
返回函数（$route）{
log（'Loading Blog Article'+$route.current.params.id）；
}
}
}
});
}
])
.controller（'BlogController'，['$scope'，'$route'，'init'，
函数（$scope、$route、init）{
初始（路线）；
}
]);
执行此操作的简单方法是，在相应的模板中使用ng init

angular.module('demo', ['ngRoute'])
 .config(['$routeProvider',
   function($routeProvider) {
    $routeProvider
    .when('/linkOne', {
      controller: 'LinkController',
      template: '<h1 ng-init="functionOne()">Hello world</h1>'
    })
    .when('/linkTwo', {
      controller: 'LinkController',
      template: '<h1 ng-init="functionTwo()">Hello Stackoverflow</h1>'
    });
 }])
 .controller('LinkController', ['$scope', function($scope) {
  $scope.functionOne = function(){
    console.log("Hello");
  }
  $scope.functionTwo = function(){
    console.log("Hello world");
  }
 }]);

angular.module（'demo'，['ngRoute']））
.config（[“$routeProvider”，
函数（$routeProvider）{
$routeProvider
。当（“/linkOne”{
控制器：“链接控制器”，
模板：“你好，世界”
})
.when（'/linkTwo'{
控制器：“链接控制器”，
模板：“你好，Stackoverflow”
});
}])
.controller（'LinkController'，['$scope'，函数（$scope）{
$scope.functionOne=函数（）{
console.log（“你好”）；
}
$scope.functionTwo=函数（）{
log（“你好世界”）；
}
}]);

HTML代码：
 <!DOCTYPE html>
   <html ng-app="demo">
    <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="#linkOne">Link One</a>
      <a href="#linkTwo">Link Two</a>

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


您是否检查过这一款，或者它与您想要的有所不同？太棒了，这一款非常好用。我不知道resolve属性，因为我比较新。谢谢没问题，很高兴我能帮忙！