Question

为什么$scope.items和First控制器中的Second仍然具有值First，为什么在调用From controller函数后它不会更改为值Load()？

HomeController中：

namespace MvcApplication6.Controllers
{
    public class HomeController : Controller
    {
        //
        // GET: /Home/

        public ActionResult Index()
        {
            return View();
        }

        public JsonResult GetData()
        {
            string data = "From controller";
            return Json(data, JsonRequestBehavior.AllowGet);
        }
    }
}

Index.cshtml

@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet" />
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css" rel="stylesheet" />

<script src="~/Scripts/jquery-1.9.1.min.js"></script>
<script src="~/Scripts/angular.js"></script>
<script src="~/Scripts/MyScript/Custom.js"></script>
<script src="~/Scripts/angular-animate/angular-animate.min.js"></script>
<script src="~/Scripts/angular-ui/ui-bootstrap.min.js"></script>
<script src="~/Scripts/angular-ui/ui-bootstrap-tpls.min.js"></script>

<div ng-controller="LoadData" id="data">

</div>
<div ng-controller="First">
    {{items}}
</div>
<div ng-controller="Second">
    {{items}}
</div>
<script>
    $(document).ready(function () {
        angular.element(document.getElementById('data')).scope().Load();
    });
</script>

Custom.js

var app = angular.module('MyApp', ['ngAnimate',  'ui.bootstrap']);

app.controller('First', function ($scope, sharedProperties) {
    $scope.items = sharedProperties.getProperty();
    console.log("First controller",sharedProperties.getProperty());
});
app.controller('Second', function ($scope, sharedProperties) {
    $scope.items = sharedProperties.getProperty();
    console.log("Second controller", sharedProperties.getProperty());
});
app.controller('LoadData', function ($scope,$http, sharedProperties) {
    $scope.Load = function () {

        $http({ method: 'GET', url: '/Home/GetData' }).
   success(function (data, status, headers, config) {
       sharedProperties.setProperty(data);
       console.log('Loaded data',data);
   }).
   error(function (data, status, headers, config) {
       alert('error');
   });
}
}
);

app.service('sharedProperties', function () {
        var property = 'First';

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

Answer 1

问题在于，在第一个和第二个控制器中，变量def return_original_board(board): original_board = [] for i in board: original_board.append(i) return original_board在加载控制器时被初始化。在那之后，他们不再被改变了。

此处的执行顺序如下：

controller＆＃39; First＆＃39;已初始化，以及变量$scope.items;
controller＆＃39; Second＆＃39;已初始化，以及变量$scope.items;
调用来自$scope.items的回调，但您永远不会在任一控制器上更新$http的值。

作为一种可能的解决方案，您可以实现一个简单的回调机制（标准观察者模式）。例如：

$scope.items

然后你让你的控制器注册他们的回调：

app.service('sharedProperties', function () {
        var property = 'First';
        var callBacks = [];

        return {
            getProperty: function () {
                return property;
            },
            setProperty: function (value) {
                property = value;
                callBacks.forEach(function(callBack) { 
                  callBack(value);
                });
            },
            registerCallback: function(callBack) {
              callBacks.push(callBack);
            }            
        };
    });

或者，您可以使用Angular events与控制器进行通信。

Answer 2

原因是你正在使用字符串。这意味着当你打电话时：

$scope.items = sharedProperties.getProperty();

您正在获取字符串的副本。要在控制器之间共享数据，可以按如下方式修改控制器：

<强> HTML：

...
<div ng-controller="First">
    {{items.getProperty()}}
</div>
...

<强> JS：

...
app.controller('First', function ($scope, sharedProperties) {
    $scope.items = sharedProperties;
});
...

或修改您的服务：

app.service('sharedProperties', function () {
        // having the 'object' property inside
        var property = {value:'First'};

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

这两种解决方案之所以有效，是因为他们正在复制对包含该值的对象的引用，而不是复制该值本身。

在控制器角度js之间共享数据

2 个答案: