Bagaimanakah Saya Boleh Berkongsi Pembolehubah Secara Berkesan Antara Pengawal AngularJS?

Berkongsi Pembolehubah antara Pengawal AngularJS

Aplikasi AngularJS selalunya memerlukan pembolehubah yang dihantar antara pengawal untuk memudahkan komunikasi dan perkongsian data. Walau bagaimanapun, mengakses pembolehubah daripada pengawal yang berbeza boleh menimbulkan cabaran.

Pendekatan Tradisional

Dalam senario yang ideal, anda mungkin cuba mengakses pembolehubah daripada pengawal lain secara terus. Walau bagaimanapun, pendekatan ini gagal melainkan pengawal berkaitan melalui model warisan $scope hierarki.

Penyelesaian: Menggunakan Perkhidmatan

Penyelesaian yang lebih berkesan ialah menggunakan perkhidmatan, yang dikongsi merentas semua pengawal. Dengan mendaftarkan perkhidmatan dengan aplikasi anda dan menyuntiknya ke dalam pengawal yang dikehendaki, anda boleh mengakses sifat dan kaedahnya untuk bertukar data.

Contoh Perkhidmatan:

angular.module('myApp').service('sharedProperties', function () {
  var property = 'First';

  return {
    getProperty: function () {
      return property;
    },
    setProperty: function (value) {
      property = value;
    },
  };
});

Penggunaan dalam Pengawal:

function Ctrl1($scope, sharedProperties) {
  sharedProperties.setProperty('Updated Value');
}

function Ctrl2($scope, sharedProperties) {
  $scope.prop2 = 'Second';
  $scope.both = sharedProperties.getProperty() + $scope.prop2;
}

Mengikat kepada Sifat

Untuk memastikan nilai dikongsi mengemas kini UI secara dinamik, pertimbangkan untuk mengikat sifat objek dan bukannya jenis primitif. Ini membolehkan rujukan dikekalkan sepanjang aplikasi.

Contoh:

// Replace 'var property = 'First';' with
var property = { Property1: 'First' };

Sumber Tambahan

• [Pembolehubah Mengikat dalam AngularJS](https://jasonwatmore.com/post/2014/08/14/AngularJS-bind-to-same-variable-in-multiple-scopes-controllers)

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Berkongsi Pembolehubah Secara Berkesan Antara Pengawal AngularJS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!