Chia sẻ dữ liệu giữa các controller trong AngularJS

Trong trang thanh toán sản phẩm em có hai controller tách biệt nhưng cùng sử dụng một biến username như sau:

<div ng-controller="firstStepCtrl">
    <div>
        <label for="username">Username:</label>
        <input id="username" type="text" ng-model="username">
    </div>
</div>

<div ng-controller="secondStepCtrl">
    <p>Xin chào <strong>{{username}}</strong></p>
</div>

Và với hai controller tương ứng như sau:

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

// Step 1
myApp.controller('firstStepCtrl', function( $scope, data ) {

});

// Step 2
myApp.controller('secondStepCtrl', function( $scope, data ) {
    $scope.username = data.username;
});

Làm thế nào để trong controller thứ hai secondStepCtrl giá trị của biến username có thể được sử dụng?

Hói 3 tháng trước

3 cách:

  1. Sử dụng service (service là singleton) và inject vào cả 2 controllers đó (recommended)
  2. Sử dụng events ($broadcast$on) để phát và bắt dữ liệu.
  3. Bỏ 2 thằng đó trong 1 thằng controller cha, và dùng 1 object trong cha để share dữ liệu cho 2 controller con đó (inherit).
Trả lời 3 tháng trước

Viết Trả Lời: