Wie kann ich Daten zwischen den Steuerungen senden AngularJS

Question

Wie kann ich Daten zwischen den Controllern AngularJS in meinem Fall senden? Ich möchte Ergebnis von gescanntem QR-Code in Dinge [] senden und, natürlich, zeigen Sie es. Ich bin Anfänger in AngularJS und JavaScript und machen dieses Programm nur für mich

App.js:

var MKscanner = angular.module('starter', ['ionic', 'ngCordova', 'ngStorage']) 
 

 
MKscanner.controller('scanBarCtrl', function($scope, $cordovaBarcodeScanner) { 
 
    
 
$scope.input ={ 
 
    MyText : '' 
 
}; 
 

 

 
    $scope.scanBarcode = function() { 
 
    $cordovaBarcodeScanner.scan(
 
     { 
 
     preferFrontCamera : false, 
 
     orientation : 'portrait' 
 
     }).then(function (result) { 
 
     alert(result.text); 
 
       }, 
 
     function (error) { 
 
     alert('Scanning failed: ' + error); 
 
     }); 
 
    }; 
 

 
}); 
 

 
MKscanner.factory ('StorageService', function ($localStorage) { 
 

 
    $localStorage = $localStorage.$default({ 
 
    things: [] 
 
    }); 
 

 
    var _getAll = function() { 
 
    return $localStorage.things; 
 
    }; 
 

 
    var _add = function (thing) { 
 
    $localStorage.things.push(thing); 
 
    } 
 

 
    var _remove = function (thing) { 
 
    $localStorage.things.splice($localStorage.things.indexOf(thing), 1); 
 
    } 
 

 
    return { 
 
    getAll: _getAll, 
 
    add: _add, 
 
    remove: _remove 
 
    }; 
 
}); 
 

 

 
MKscanner.controller('MainCtrl', function ($scope, StorageService) { 
 
    $scope.things = StorageService.getAll(); 
 

 
    $scope.add = function (newThing) { 
 
    StorageService.add(newThing); 
 
     }; 
 

 
    $scope.remove = function (thing) { 
 
    StorageService.remove(thing); 
 
    }; 
 
});

<div ng-controller="MainCtrl"> 
 
      <div class="list"> 
 
       <div class="item item-input-inset"> 
 
        <label class="item-input-wrapper"> 
 
         <input type="text" placeholder="Save your own text" ng-model="newThing"> 
 
        </label> 
 
        <button class="button button-clear button-positive icon" ng-click="add(newThing)"> 
 
         <i class="ion-ios-plus-outline"></i> Add 
 
        </button> 
 
       </div> 
 
      </div> 
 

 
      <ion-list show-delete="false" can-swipe="true"> 
 
       <ion-item ng-repeat="thing in things"> 
 
        {{thing}} 
 
        <ion-option-button class="button-assertive ion-trash-b" ng-click="remove(thing)"></ion-option-button> 
 
       </ion-item> 
 
      </ion-list> 
 
      </div>

Answer 1

Sie können emittieren mit $ Daten zwischen den Controllern teilen und $ ausgestrahlt: Diese Ereignisse können auch zum Senden von Daten verwendet werden. Das klassische Beispiel ist unten angegeben. Sie können Daten für jeden Controller in der App freigeben.

   <div ng-app="myApp" ng-controller="myCtrl"> 
       <button ng-click="sendData();"></button> 
      </div> 


      <script> 
       var app = angular.module('myApp', []); 
       app.controller('myCtrl', function($scope, $http) { 
        function sendData($scope) { 
         var arrayData = [1,2,3]; 
         $scope.$emit('someEvent', arrayData); 
        } 

       }); 
       app.controller('yourCtrl', function($scope, $http) { 
        $scope.$on('someEvent', function(event, data) { 
         console.log(data); 
        }); 
       }); 
      </script>