5

我喜欢 AngularJS 不需要模型的特殊语法，但有一种情况我似乎无法理解。采取以下

我的 dataService 包装了我正在使用的任何类型的数据存储：

app.factory('dataService', function() {
    var data = 'Foo Bar';

    return {
        getData: function() {
            return data;
        }
    };
});

我有两个控制器都访问相同的数据：

app.controller('display', function($scope, dataService) {
    $scope.data = dataService.getData();
});

app.controller('editor', function($scope, dataService) {
    $scope.data = dataService.getData();
});

如果我有两个视图，其中一个修改数据，为什么另一个不自动更新？

<div ng-controller="display">
<p>{{data}}</p>
</div>

<div ng-controller="editor">
<input type="text" value="{{data}}"/>
</div>

我了解这在诸如 Knockout 之类的东西中是如何工作的，在这种情况下，我将被迫将数据设为可淘汰的可观察对象。因此，对应用程序某一部分的任何修改都会触发订阅并更新另一部分的视图。但我不确定如何在 Angular 中进行操作。

有什么建议吗？

4

2 回答 2

7

我建议进行一些更改以使其正常工作。

  1. 将数据对象从字符串更改为对象类型
  2. 使用ng-model绑定输入字段

HTML

<div ng-controller="display">
  <p>{{data.message}}</p>
</div>

<div ng-controller="editor">
  <input type="text" ng-model="data.message"/>
</div>

脚本

app.factory('dataService', function() {
    var data = {message: 'Foo Bar'};

    return {
        getData: function() {
            return data;
        }
    };
});

演示：小提琴

于 2013-04-01T03:02:14.837 回答
1

我没有遇到同样的情况，但是让我跳出来的是你坚持在范围内的东西。有一个角度视频讨论了范围。您应该将模型对象放在范围内，而不是将范围用作模型对象。

在您的示例中，将使用 string 创建两个范围data。由于data是字符串且不可变，因此更改时将在编辑器范围内替换。在您的示例中，如果您dataService返回了一个对象并且该对象在控制器之间共享，那么您的问题可能会得到解决。尝试dataService返回model{data: data} 并绑定到model.data而不是data.

这是未经测试的，但应该根据我对角度工作的了解来工作。

于 2013-04-01T02:57:11.450 回答