角的$范围内的福利/额外的抽象层的缺点 [英] Benefits/drawbacks of additional abstraction layer within Angular's $scope

查看:131
本文介绍了角的$范围内的福利/额外的抽象层的缺点的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我稍微从以下网址修改的例子( http://docs.angularjs.org/cookbook /的HelloWorld )如下,放置名称 ATTRS 对象属性值之内:

I have slightly modified the example from the following URL (http://docs.angularjs.org/cookbook/helloworld) as follows, placing the name value within an attrs object property:

<!doctype html>
<html ng-app>
  <head>
    <script src="http://code.angularjs.org/1.2.9/angular.min.js"></script>
    <script>
      function HelloCntl($scope) {
        $scope.attrs = {
            name : 'World'
        }
      }
    </script>
  </head>
  <body>
    <div ng-controller="HelloCntl">
      Your name: <input type="text" ng-model="attrs.name"/>
      <hr/>
      Hello {{attrs.name || "World"}}!
    </div>
  </body>
</html>

一个好处,我可以看到的是, HTML的来源$ C ​​$ C可以搜索 / ATTRS \\。\\ w + / (例如: )如果有以往任何时候都需要很容易地找到该视图内的所有这样的属性,而不是控制器(如名称的搜索可以与表单元素名称冲突)。同时,控制器内,我只能想象,分区属性所必需的前端可能适合以更好的组织。

One benefit I can see is that the HTML source code can be searched for /attrs\.\w+/ (e.g.) if there is ever a need to easily find all such attributes within the view rather than the controller (e.g. a search for name could collide with form element names). Also within the controller I can only imagine that partitioning attributes necessary for the front end might lend itself to better organization.

时别人用抽象的水平。在那里它的使用任何可能的具体进一步的好处?而最重要的是,可能会有任何具体的缺点吧。

Is anybody else using such a level of abstraction. Are there any possible specific further benefits to it's usage? And most importantly, might there be any specific drawbacks to it.

推荐答案

它的建议,你总是为了避免与原型潜在的问题使用你的 ngModel 个点这在角指南了解作用域讨论继承:

It's recommended that you always use a dot in your ngModels in order to avoid potential issues with prototypal inheritance that are discussed in Angular's Guide to Understanding Scopes:

这与原语的问题可以按照很容易地避免
  始终有一个'。在NG-车型 - 3腕表
  值得一分钟。 MISKO演示与原始结合问题
  NG-开关。

This issue with primitives can be easily avoided by following the "best practice" of always have a '.' in your ng-models – watch 3 minutes worth. Misko demonstrates the primitive binding issue with ng-switch.

原型继承和原语

在Java脚本的方式继承的读取和写入原始的行为方式即可。读取时,如果原始不会对当前的范围存在,试图找到它的任何父范围。但是,如果你写一个原始的,它不能在当前范围存在,会立即创建一个在该范围。

In javascripts' approach to inheritance reading and writing to a primitive act differently. When reading, if the primitive doesn't exist on the current scope it tries to find it on any parent scope. However, if you write to a primitive that doesn't exist on the current scope it immediately creates one on that scope.

您可以看到这可能会导致问题在具有3 scopes-一个父这个小提琴并两个孩子是姐弟。第一类的东西,在父,你会看到两个孩子被更新。然后键入的东西在孩子的不同。现在。只有孩子被更新,因为写造成孩子创建它自己的变量拷贝。现在如果你重新更新父,只有等孩子会跟踪它。如果你输入一些东西到同级孩子所有的三个范围现在有自己的副本。

You can see the problem this can cause in this fiddle that has 3 scopes- one parent and two children that are siblings. First type something in the "parent" and you'll see that both children are updated. Then type something different in one of the children. Now. only that child is updated, because the write caused the child to creates it's own copy of the variable. If you now update the parent again, only the other child will track it. And if you type something into the sibling child all three scopes will now have their own copies.

这显然会导致很多问题。

This can obviously cause lots of issues.

原型继承和对象

请尝试使用这个小提琴其中每个 ngModel 使用对象,而不是原始的属性。现在,的读取和写入行为一致

Try the same experiment with this fiddle in which each ngModel uses a property of an object instead of a primitive. Now both reading and writing act consistently.

当你写一个对象的属性它的作用就像读书呢(以及如何写一个原始的对立面一样)。如果你正在编写的对象并不在当前范围存在,查找它的父链试图找到对象。如果找到一个具有该名称然后将它写入到找到对象的属性。

When you write to a property of an object it acts just like reading does (and the opposite of how writing to a primitive does). If the object you're writing to does not exist on the current scope it looks up it's parent chain trying to find that object. If it finds one with that name then it writes to the property on that found object.

因此​​,尽管在原始示例我们开始1变量,然后写入到孩子后结束了可变的3份当我们使用一个目的,我们仅曾经有一个对象的一个​​属性。

So, while in the primitive example we started with 1 variable and then after writing to the children ended up with 3 copies of the variable- when we use an object we only ever have the one property on the one object.

由于我们几乎总是,也许只是一如既往,希望此一致的行为的建议是只使用对象的属性,在没有原语的 ngModel ,或者说更普遍, 总是用一个点在你的 ngModel

Since we almost always, perhaps just always, want this consistent behavior the recommendation is to only use objects properties, not primitives in an ngModel or, said more commonly, "always use a dot in your ngModel"

这篇关于角的$范围内的福利/额外的抽象层的缺点的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆