傳遞值從頁面到另一個頁面

Question

嘿大家想從網頁發送值到另一個我試圖使用一個服務，然後我又控制器，所以我可以從控制器將數據發送到另一個控制器，最後我想console.log的結果，但沒有什麼是顯示

這裏是我的app.js文件

//*********************************************************************************** 
var app=angular.module("siad",[]); 
//*********************************************************************************** 

app.controller("siadController",['$scope','$http','dataShare','$location',function($scope,$http,dataShare,$location){ 


$http.get("/formulaire/all") 
.success(function(data){ 
    $scope.formulaire=data ; 
}); 


$scope.send=function(){ 
    //$scope.id=f.id_form; 
    //console.log(f) 
    /**$http.get("/question/form?idfrom="+f.id_form) 
    .success(function(data){ 
     $scope.question=data; 
    console.log($scope.question) 
    }) 
    **/ 
     $scope.text = 'sssss'; 
     $scope.send = function(){ 
     dataShare.sendData($scope.text); 
     $location("/user/lesFormulaires.html") 
     } 



} 



}]); 

//*********************************************************************************** 

app.controller("siadController2",['$scope','$http','dataShare',function($scope,$http,dataShare){ 


    $http.get("/formulaire/all") 
    .success(function(data){ 
     $scope.formulaire=data ; 
    }); 

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


}]); 
//*********************************************************************************** 

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

和這裏的HTML按鈕，當我點擊我通過

<a href="/user/lesFormulaires.html" ng-click="send();" class="btn btn-large btn-primary black-btn">clickme</a> 

重定向到另一個頁面和發送數據

感謝所有幫助

Answer 1

好像你想要的是用於發送和接收消息，這是更方便的事件的巴士服務。

這是我使用上述目的使用該服務：

angular.module('core').factory('event', [ 
    function() { 
     var service = {}; 
     var events = {}; 

     service.on = function (eventId, callback) { 
      // validations... 
      if(!events[eventId]) 
       events[eventId] = []; 
      events[eventId].push(callback); 
      return { 
       unsubscribe: function(){ 
        service.unsubscribe(eventId, callback); 
       } 
      }; 
     }; 

     service.emit = function(eventId, data, callback){ 
      if(events[eventId] && !!events[eventId].length){ 
       for(var i=0; i<events[eventId].length; i++){ 
        events[eventId][i](data, callback); 
       } 
       return true; 
      } 
      else return false; 
     }; 
     service.unsubscribe = function(eventId, callback){ 
      if(events[eventId]){ 
       for(var i=0; i<events[eventId].length; i++){ 
        if(events[eventId][i].toString() === callback.toString()){ 
         events[eventId].splice(i,1); 
        } 
        return true; 
       } 
      }else return false; 
     }; 

     return service; 
    } 
]); 

使用裝飾註冊服務，並在任何你想要的控制器使用。

$provide.decorator('$rootScope', ['$delegate', 'event', function($delegate, event){ 
     Object.defineProperty($delegate.constructor.prototype, 'eventBus', { 
      get:function(){ 
       var self = this; 
       return{ 
        on:function(eventId, callback){ 
         var ev = event.on(eventId, callback); 
         self.$on('$destroy', function(){ 
          ev.unsubscribe(); 
         }); 
        }, 
        emit: event.emit 
       }; 
      }, 
      enumerable: false 
     }); 
     return $delegate; 
    }]); 

然後使用很簡單，只要：

$scope.eventBus.on('someEvent', function(){ 
}); 

$scope.eventBus.emit('someEvent'); 

編輯：

你可以在你的引導你的應用程序的時候添加你的裝飾配置，對我來說是

angular.module('core').config(function($provide){ 
} 

按照documentation

時要公開的API 爲必須的 應用程序啓動前提出申請範圍內的配置時，才應使用提供配方。

這個article解釋了一點點關於如何設置角度提供商配置，谷歌它你會發現一百萬文章關於這個主題。

Answer 2

檢查這個

(function(){ 
'use strict'; 

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

app.controller('firstCtrl', ['dataService', function(dataService){ 
dataService.store("Test"); 
}]); 

app.controller('secondCtrl', ['dataService', function(dataService){ 
var data = dataService.getData(); 
console.log(data); 
}]); 

app.service('dataService', [function(){ 

var _storage ; 

this.getData = function(){ 
return data; 
} 

this.store = function(data){ 
_storage = data; 
} 
}]); 

}()); 

當你會改變你的狀態（或頁面）存儲控制器將被摧毀，但服務不會，你將能夠獲得數據。這隻適用於如果你不使用window.reload重新加載頁面或像這樣的smth。

如果這樣做，請使用會話存儲或任何其他獨立存儲。

希望他會幫助

Answer 3

剛剛更改了app.js的一行，並可以實現你的功能

應用。JS

//********************************************* 
    var app=angular.module("siad",[]); 
    //********************************************* 

app.controller("siadController",['$scope','$http','dataShare','$location',function($scope,$http,dataShare,$location){ 


$http.get("/formulaire/all") 
.success(function(data){ 
    $scope.formulaire=data ; 
}); 


$scope.send=function(){ 
    //$scope.id=f.id_form; 
    //console.log(f) 
    /**$http.get("/question/form?idfrom="+f.id_form) 
    .success(function(data){ 
     $scope.question=data; 
    console.log($scope.question) 
    }) 
    **/ 
     $scope.text = 'sssss'; 
     **/*$scope.send = function(){ 
     dataShare.sendData($scope.text); 
     $location("/user/lesFormulaires.html") 
     }*/** 
     dataShare.sendData($scope.text); 


} 



}]); 

//*********************************************************************************** 

app.controller("siadController2",['$scope','$http','dataShare',function($scope,$http,dataShare){ 


    $http.get("/formulaire/all") 
    .success(function(data){ 
     $scope.formulaire=data ; 
    }); 

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


}]); 
//*********************************************************************************** 

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

的index.html

<!DOCTYPE html> 
<html> 
<head> 
    <title> The index</title> 
    <script type="text/javascript" src ="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"> 
    </script> 
    <script type="text/javascript" src="app.js"></script> 
</head> 
<body ng-app ="siad"> 
<div ng-controller="siadController"> 
<a ng-click="send();" class="btn btn-large btn-primary black-btn">clickme</a> 
</div> 
<div ng-controller="siadController2"> 
</div> 
</body> 
</html>