70

在视频AngularJS MTV Meetup: Best Practices (2012/12/11)中，Miško 解释说“..如果你使用 ng-model，那么某处必须有一个点。如果你没有一个点，那么你正在做错误的..”

但是，Angular.JS 网站中的第一个示例（基础知识）似乎与它相矛盾。是什么赋予了？自从 MTV 聚会以来，Angular.JS 是否发生了变化，现在它对 ng-model 更加宽容了？

4

4 回答 4

109

在处理范围继承的复杂性时，这个小点非常重要。

egghead.io 视频“The Dot”有一个非常好的概述，这个非常流行的堆栈溢出问题也是如此：AngularJS 中范围原型/原型继承的细微差别是什么？

我将在这里尝试总结一下：

Angular.js 使用范围继承来允许子范围（例如子控制器）查看父范围的属性。所以，假设你有这样的设置：

<div ng-controller="ParentCtrl">
    <input type="text" ng-model="foo"/>
    <div ng-controller="ChildCtrl">
        <input type="text" ng-model="foo"/>
    </div>
</div>

（在 JSFiddle 上玩）

起初，如果您启动应用程序并在父输入中键入内容，则子输入会更新以反映它。

但是，如果您编辑子作用域，则与父作用域的连接现在断开，两者不再同步。另一方面，如果您使用ng-model="baz.bar"，则链接将保留。

发生这种情况的原因是因为子作用域使用原型继承来查找值，所以只要它永远不会在子作用域上设置，那么它将遵循父作用域。但是，一旦设置，它就不再查找父级。

当您改用对象 ( baz) 时，不会在子范围上设置任何内容，并且继承仍然存在。

有关更深入的详细信息，请查看StackOverflow 答案

于 2013-07-12T05:11:16.503 回答
17

当您原型从另一个范围继承一个范围时，将需要点，例如在 ng-repeat 的情况下，将为原型从父范围继承的每个行项目创建一个新范围。在基本示例中，没有原型继承，因为只有一个范围，但如果您有多个子范围，那么您将开始面临问题。下面的链接将使一切变得清晰。

https://github.com/angular/angular.js/wiki/Understanding-Scopes#ng-repeat

于 2013-07-12T05:08:05.803 回答
0

所以要解决这个问题，请确保在 JS 中首先声明父级：

例如

$scope.parent

其次是：

$scope.parent.child = "Imma child";

只做没有父母的孩子会破坏Angular。

于 2017-01-24T12:42:01.983 回答
0

根据@OverZealous的回答，我为此想出了一个肮脏但舒适简单且快速的解决方法：

$scope.$s = $scope
$scope.foo = 'hello'

然后$s在模板中使用可以安全地修改模型：

<input ng-model="$s.foo"/>

我在我的项目中为这些肮脏的作品写了一个服务。

于 2020-07-17T10:31:41.440 回答