如何在兩個不同的控制器中傳遞ng-model的值

Question

我有一個ng-model ，我希望從兩個不同的控制器訪問其值。 我知道在兩個不同的控制器之間共享數據的方法是使用service 。 但是我不能將ng-model的值用於服務，而只能用於控制器。

Answer 1

您可以將兩個控制器div封裝在共同的父級中，然后將$ watch（）包裝為該模型的更改，然后在$ watch（）中監視更改時，將$ emit（）的更改包裝到子控制器。

參考鏈接

$手表參考

$ emit參考

Answer 2

您可以使用rootscope訪問該ng-model變量。但這不是一個好習慣。

<input ng-model="mk" type="text">

在控制器中：

$rootScope.mk=$scope.mk;

並在其他控制器中以$rootScope.mk身份訪問

注意：您必須在控制器中注入$ rootScope。

Answer 3

為什么不能使用服務？ 服務正是您跨應用程序不同部分共享數據的方式。 您可以通過在每個控制器上公開您的服務並將ng-model綁定到該服務來實現此目的。

JS

angular.module('app', [])
  .factory('User', [function () {
    var service = {
      username: null
    };
    return service;
  }])
  .controller('MainCtrl', ['$scope', 'User', function ($scope, User) {
    $scope.User = User;
  }])
  .controller('SecondCtrl', ['$scope', 'User', function ($scope, User) {
    $scope.User = User;
  }]);

的HTML

<div ng-controller="MainCtrl">
  <input type="text" ng-model="User.username">
</div>
<div ng-controller="SecondCtrl">
  <input type="text" ng-model="User.username">
</div>

柱塞： http ://plnkr.co/edit/VSEHD970O0xWbu6OCPqB?p=preview