访问angularJS中页面之间的控制器

access controllers between pages in angularJS

本文关键字：之间 控制器 angularJS 访问      更新时间：2023-09-26

我是angular js的新手。我的问题是，是否可以为不同的页面共享一个控制器。

我有一个网站的模板。现在我正在尝试用angular js进行编码。我有两个页面，像home.html和new.html

home.html如下。

 <!DOCTYPE html>
    <html>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
    <body>
    <div ng-app="myApp" ng-controller="kkCtrl">
        <p>My first expression: {{ 5 + 5 }}</p>
    <a herf="new.html" ng-click="getDatass('w')"> new</a>
    </div
    </body>
    </html>

 <script>
    var app = angular.module('myApp', []);
    app.controller('kkCtrl',["$scope", "$http", function($scope, $http) {
    $scope.getDatass= function(a){
            $scope.k= a;
    }
    }])
    </script>

我的新.html是

<div ng-controller="kkCtrl">
    <table>
    <tr><td>kkk</td>
    <td>lll</td>
    </tr>
    </table>
    {{k}}
    </div>

我的问题是，如果我点击home.html上的"new"链接，它应该重定向到new.html，并且是否可以在new.html中查看"$scope.a"的值…请帮助我。

我不认为在页面之间共享控制器是AngularJS的最佳实践。每个视图都应该有自己的控制器。如果要在每个视图页面之间传递数据，可以使用angular-ui-router通过ui-sref传递参数来实现。我建议您在这里阅读更多关于AngularJS最佳实践的内容。它提供了AngularJS中使用的最佳样式指南。

您无法访问new.html中home.html中设置的范围变量。

我们可以在任意数量的视图中使用相同的控制器。但当创建任何新的视图时，控制器都是用$scope的新实例创建的。

控制器的行为就像第一次加载一样。

为了解决您的问题，您可以创建一个角度服务或工厂，并将其用于数据共享。

每个视图都应该有自己的控制器。如果您想要"全局"函数/变量，即视图（控制器）之间共享的代码，您应该考虑服务的概念。创建一个包含k变量的服务，并通过依赖注入使该服务在控制器中可用。

angular.module('myApp')
  .factory('myService', function() {
   //local variable or functions here
   var local = true;
   //variables and functions exposed to the outside 
   return {
      k: 0
   }
});

现在包括myService作为kkCtrl:的依赖项

app.controller('kkCtrl',["$scope", "$http", "myService", function($scope, $http, myService) {

您现在可以设置或获取k:

$scope.getDatass= function(a){
  myService.k = a;
}
相关文章：