从另一个访问一个控制器数据

时间:2016-05-16 13:07:45

标签: angularjs

我想使用从一个控制器到另一个控制器的数据,任何人都可以帮助我。例如:

  .controller('firstCtrl',function($scope){
   $scope.item = [{id:1, name:'John'},{id:2, name:'carter'},{id:3, name:'barsoom'},..]
   })
   .controller('secondCtrl',function($scope){
    $scope.jsondata = item;
    console.log(JSON.stringify($scope.jsondata));
   })

有可能吗?谁能帮帮我吗。谢谢。

3 个答案:

答案 0 :(得分:1)

如果要在控制器之间共享数据,则应使用Angular Services。它们是单例,旨在用于共享应用程序中的公共代码。因此,例如,放置$ http请求或许多地方使用的某些数据是一种很好的做法。

一些例子是:

https://jsfiddle.net/relferreira/2b5amcya/

JS:

<div data-ng-app="app">

  <div data-ng-controller="MainController as mainVm">
    {{mainVm.name}}
  </div>

  <div data-ng-controller="DetailController as detailVm">
    {{detailVm.name}}
    {{detailVm.other}}
  </div>

</div>

HTML:

 <body ng-app="myApp">

    <div ng-controller="ctrl">
        {{name}}

    </div>

    <div ng-controller="c">
        {{name}}

    </div>


</body>

var app = angular.module('myApp', []).controller('ctrl', ['$scope', '$rootScope', function ($scope, $rootScope) {

    $rootScope.name = "vipin";

}]).controller('c', ['$scope', '$rootScope', function ($scope) {


}])

答案 1 :(得分:1)

试试这个

var app = angular.module('myApp', []).controller('ctrl', ['$scope', '$rootScope', function ($scope, $rootScope) {

        $rootScope.name = "vipin";
    }]).controller('c', ['$scope', '$rootScope', function ($scope) {


    }])

运行此代码,您可以在两个控制器中获取$ rootScope.name值

&#13;
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js"></script>

<body ng-app="myApp">    
    <div ng-controller="ctrl">
        {{name}}
    </div>

    <div ng-controller="c">
        {{name}}
    </div>
</body>
&#13;
user  nginx;
worker_processes  1;

error_log  /var/log/nginx/error.log warn;
pid        /var/run/nginx.pid;


events {
    worker_connections  1024;
}


http {
    include       /etc/nginx/mime.types;
    default_type  application/octet-stream;

    log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
                      '$status $body_bytes_sent "$http_referer" '
                      '"$http_user_agent" "$http_x_forwarded_for"';

    access_log  /var/log/nginx/access.log  main;

    sendfile        on;
    #tcp_nopush     on;

    keepalive_timeout  65;

    #gzip  on;

    upstream app {
        server django:5000;
    }

    server {
        listen                  80;
        server_name             www.example.com;
        rewrite ^/(.*)          https://www.example.com/$1 permanent;
    }

    server {
        listen                  443 ssl;
        server_name             www.example.com;
        charset                 utf-8;

        ssl                     on;
        ssl_certificate         /etc/nginx/ssl/1_www.example.com_bundle.crt;
        ssl_certificate_key     /etc/nginx/ssl/example_rsa.key;

        location / {
            try_files           $uri                    @proxy_to_app;
        }

        location @proxy_to_app {
            proxy_pass          http://app;
            proxy_redirect      off;

            proxy_set_header    X-Forwarded-Proto       $scheme;
            proxy_set_header    X-Forwarded-For         $proxy_add_x_forwarded_for;
            proxy_set_header    X-Real-IP               $remote_addr;
            proxy_set_header    Host                    $http_host;
        }

    }
}
&#13;
&#13;
&#13;

答案 2 :(得分:0)

您可以使用事件广播服务注入控制器。

方法1:

myApp.controller('FirstCtrl', function ($scope) {
    $scope.$broadcast('Test_Data',{ data: {} });
  })
myApp.controller('SecondCtrl', function ($scope) {
    $scope.$on('Test_Data', function(event, args) {
        var data= args.data
      // do something useful here;
    });
  });

方法2:

     myApp.factory('TestData', function () {
        var data = {};
            var setData=function(){...}
        return data;
      });
    myApp.controller('FirstCtrl', function ($scope, TestData) {
        $scope.data = TestData;
      })