如何在两个不同的控制器中传递ng模型的值

How to pass the value of ng-model in two different controllers

本文关键字：控制器 模型 ng 两个      更新时间：2023-09-26

我有一个ng-model，我希望从两个不同的控制器访问它的值。我知道在两个不同的控制器之间共享数据的方法是使用service。但我不能将ng-model的值用于服务，只能从控制器使用。

您可以使用rootscope来访问该ng模型变量。但这不是一个好的做法。

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

在控制器中：

$rootScope.mk=$scope.mk;

并将其作为$rootScope.mk 在其他控制器中访问

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

当在$watch（）中监视更改时，您可以将两个控制器div包装在一个共同的父控制器中，然后为该模型的更改打包$watch

参考链接

$watch参考

$emit参考

为什么不能使用服务？服务正是您在应用程序的不同部分之间共享数据的方式。您可以通过在每个控制器上公开您的服务并将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>

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

相关文章：