2016-04-10 8 views
0

私はあるコントローラから別のコントローラにデータを送信しようとしています。ちょっとした背景として、これはコードがイオンアプリケーションで使用されている場合にはそのコードです。私はsend()関数からSubCtrlにデータを送信します。 MainCtrlでsend関数が呼び出されています。私はこれのためのサービスを作成しましたが、データはまだ共有されていません。この行動を完了するために何が欠けていますか?機能の別の状態への復帰

var app = angular.module('testapp', []); 
 

 
    app.config(function($stateProvider, $urlRouterProvider) { 
 
     "use strict"; 
 

 
     /* Set up the states for the application's different sections. */ 
 
     $stateProvider 
 
     .state('page2', { 
 
      name: 'page2', 
 
      url: '/page2', 
 
      templateUrl: 'page2.html', 
 
      controller: 'MainCtrl' 
 
     }) 
 
     .state('page3', { 
 
      name: 'page3', 
 
      url: '/page3', 
 
      templateUrl: 'page3.html', 
 
      controller: 'SubCtrl' 
 
     }); 
 
     $urlRouterProvider.otherwise('/page2'); 
 

 
    }); 
 

 
    app.factory('dataShare', function($rootScope) { 
 
     var service = {}; 
 
     service.data = false; 
 
     service.sendData = function(data) { 
 
     this.data = data; 
 
     $rootScope.$broadcast('data_shared'); 
 
     console.log(data); 
 
     }; 
 
     service.getData = function() { 
 
     return this.data; 
 
     }; 
 
     return service; 
 
    }); 
 

 

 
    app.controller('MainCtrl', function($scope, $state, $http, dataShare) { 
 

 
     $scope.text = 'food'; 
 
     $scope.send = function() { 
 
     dataShare.sendData(this.text); 
 
     }; 
 

 

 
    }); 
 

 
    app.controller('SubCtrl', function($scope, $state, dataShare) { 
 
     "use strict"; 
 

 
     var sc = this; 
 

 
     $scope.text = ''; 
 
     $scope.$on('data_shared', function() { 
 
     var text = dataShare.getData(); 
 
     sc.text = dataShare.data; 
 
     }); 
 

 

 

 
    });
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<script id="page2.html" type="text/ng-template"> 
 
    <div>{text}}</div> 
 
    <input type='text' ng-model='text' /> 
 
    <button class="button button-outline button-royal" ng-click="send();">add</button> 
 

 
</script> 
 

 
<script id="page3.html" type="text/ng-template"> 
 
    <div>text: {{text}}</div> 
 
</script>

答えて

0

私はこのpageを読んだ後、この問題を把握することができました。誰かが同様の問題を抱えているなら、私はこの読書を励ますでしょう。また、このポストのビデオリンクは本当に役に立ちました。

関連する問題