在AngularJS中的控制器之间共享数据 [英] Sharing data between controllers in AngularJS

问题描述

我了解了如何在控制器之间共享数据，但是遇到了一些问题.

I learn how sharing data between controllers, but I encounter some problem.

我有这样的html视图:

I have such html view:

<div ng-app="MyApp">
    <div ng-controller="firstCtrl">
        <input type="text" ng-model="data.message"/>    
        {{data.message}} 
    </div>
    <div ng-controller="secondCtrl">
        <input type="text" ng-model="data.message"/>    
        {{data.message}}    
    </div>
    <div ng-controller="thirdCtrl">
        <input type="text" ng-model="data.message"/>    
        {{dataTwo.messageTwo}}
    </div>  
</div>  

我的脚本如下:

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

myApp.service("Data", function() {
    return {
        message : "Hello World",
    }
 });

function firstCtrl($scope, Data) {
    $scope.data = Data; 
};

function secondCtrl($scope, Data) {
    $scope.data = Data;     
};

function thirdCtrl($scope, Data) {

    $scope.data = Data; 
    $scope.dataTwo = {
        messageTwo : $scope.data.message    
    };

};

我通过使用服务"来连接控制器.一切正常，但在第三个控制器"dataTwo.messageTwo"中，当我将新值传递给输入字段时，它保持不变.dataTwo.messageTwoi的值始终是相同的("Hello World").

I connect my controllers by using "Service". Everything work good but in third controllers "dataTwo.messageTwo" not changing when I passing new value to input field.Value of dataTwo.messageTwoi is the whole time same ("Hello World").

我做错了什么?

推荐答案

dataTwo.messageTwo未绑定到$scope.data.message.在控制器创建期间，它仅获得一次其值.因此无法以这种方式进行绑定.
如果要更改dataTwo，则需要在输入模型中定义它，例如:ng-model="dataTwo.messageTwo".

dataTwo.messageTwo is not binded to $scope.data.message. it just get its value once during creation of the controller. so it is not possible to do binding that way.
If you want dataTwo to be changed you need to define it in the input model like this: ng-model="dataTwo.messageTwo".

这篇关于在AngularJS中的控制器之间共享数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！