angular.js - Masalah dengan data yang dimuatkan secara tak segerak dikongsi antara pengawal dalam angularjs?

Question

app.factory('userService', ['$http', function ($http) {
         var userService= {},
                                    
         userService.getUsers = function () {                    
             return $http.get('getUsers');
         }     
         userService.users =[];                                       
         return userService;
 }]);

app.controller("FirstController",["$http","userService",function($http,userService){
       userService.getUsers().success(function (users){
           userService.users = users;//在SecondController得不到数据
       })
       //userService.users=[1,2,3] 如果我这样更新数据,在SecondController可以获得数组[1,2,3]

  }])
app.controller("SecondController",["$http","userService",function($http,userService){
   //userService.users 此得到的为空数组 
    //但是console.log(userService) 可以看到userService.users中有数据

  }])

Answer 1

Permintaan $http ialah operasi tak segerak Apabila melaksanakan SecondController, tiada jaminan bahawa data telah diperoleh pada masa ini

.

Answer 2

Jika anda ingin mengelak $http ke dalam perkhidmatan anda sendiri, anda mesti memahami mod $q dan promise Pada masa ini, anda sama dengan menggunakan idea segerak untuk melaksanakan operasi tak segerak.

Answer 3

Terdapat banyak masalah sedemikian dalam projek kami. Biar saya bercakap secara ringkas tentang penyelesaian semasa saya. Seperti di atas, perkhidmatan dikapsulkan, dan HTTP digunakan untuk meminta data Apabila data dikembalikan, salinan disimpan dalam cache Semua pengawal yang memerlukan data menggunakan perkhidmatan ini untuk memastikan konsistensi data.

Answer 4

Secara amnya, janji digunakan untuk merangkum pelayan. (Amalan yang disyorkan)

Penyoal tidak mahu menggunakan janji, jadi menggunakan panggilan balik juga boleh menyelesaikan masalah.

Idea lain ialah menggunakan pemberitahuan acara Apabila pelayan memperoleh data, ia menggunakan acara untuk memberitahu pengawal.

Answer 5

Dikatakan di tingkat atas bahawa ia boleh diselesaikan menggunakan panggilan balik. Saya mencubanya dan ia berjaya Kongsi kod itu

send() ialah acara keyup untuk mendapatkan nilai input secara dinamik dalam pengawal pertama

var app = angular.module("zgeApp",[]);
    app.controller('firstCtrl', ['$scope','change', function($scope,change){
        $scope.send = function(){
           change.callback($scope.name)
        }
    }])
    app.controller('secondCtrl', ['$scope','change', function($scope,change){
        change.callback = function(data){
            $scope.name1 = data;
        }                      
    }])
    app.service("change",function(){
        return {};
    })