You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
>The chain-of-responsibility pattern is a design pattern consisting of a source of command objects and a series of processing objects. Each processing object contains logic that defines the types of command objects that it can handle; the rest are passed to the next processing object in the chain. A mechanism also exists for adding new processing objects to the end of this chain.
1225
+
-->
1223
1226
1224
1227

As stated above the scopes in an AngularJS application form a hierarchy known as the scope chain. Some of the scopes are "isolated", which means that they don't inherit prototypically by their parent scope, but are connected to it via their `$parent` property.
When `$emit` or `$broadcast` are called we can think of the scope chain as event bus, or even more accurately chain of responsibilities. Once the event is triggered it is emitted downwards or upwards (depending on the method, which was called). Each subsequent scope may:
1237
+
-->
1229
1238
1239
+
- 处理该事件并传递给链条中的下一环
1240
+
- 处理该事件并终止传递
1241
+
- 不处理此事件,而直接将事件传递给下一环
1242
+
- 不处理此事件,并终止传递
1243
+
<!--
1230
1244
- Handle the event and pass it to the next scope in the chain
1231
1245
- Handle the event and stop its propagation
1232
1246
- Pass the event to the next scope in the chain without handling it
In the example bellow you can see an example in which `ChildCtrl` triggers an event, which is propagated upwards through the scope chain. In the case above each of the parent scopes (the one used in `ParentCtrl` and the one used in `MainCtrl`) are going to handle the event by logging into the console: `"foo received"`. If any of the scopes should be considered as final destination it can call the method `stopPropagation` of the event object, passed to the callback.
1253
+
-->
1236
1254
1237
1255
```JavaScript
1238
1256
myModule.controller('MainCtrl', function ($scope) {
@@ -1252,33 +1270,57 @@ myModule.controller('ChildCtrl', function ($scope) {
>In object-oriented programming, the command pattern is a behavioral design pattern in which an object is used to represent and encapsulate all the information needed to call a method at a later time. This information includes the method name, the object that owns the method and values for the method parameters.
When we want to bind our model to the view we use the directives `ng-bind` (for single-way data binding) and `ng-model` (for two-way data binding). For example, if we want each change in the model `foo` to reflect the view we can:
1295
+
-->
1266
1296
1267
1297
```html
1268
1298
<spanng-bind="foo"></span>
1269
1299
```
1270
1300
1301
+
每当我们改变 `foo` 的值时,span 中的 inner text 就会随之改变。我们可以使用更复杂的 AngularJS 表达式来实现同样的效果,例如:
1302
+
<!--
1271
1303
Now each time we change the value of `foo` the inner text of the span will be changed. We can achieve the same effect with more complex AngularJS expressions, like:
1304
+
-->
1272
1305
1273
1306
```html
1274
1307
<spanng-bind="foo + ' ' + bar | uppercase"></span>
In the example above the value of the span will be the concatenated uppercased value of `foo` and `bar`. What happens behind the scene?
1313
+
-->
1278
1314
1315
+
每个 `$scope` 都含有名为 `$watch` 的函数方法。当 AngularJS 编译器找到 `ng-bind` directive 时,就会为 `foo + ' ' + bar | uppercase` 表达式创建一个新的监视器,即 `$scope.$watch("foo + ' ' + bar | uppercase", function () { /* body */ });`。每当表达式的值改变时,其中的回调函数就会被触发。在本例中,回调将会更新 span 的文本值。
1316
+
<!--
1279
1317
Each `$scope` has method called `$watch`. When the AngularJS compiler find the directive `ng-bind` it creates a new watcher of the expression `foo + ' ' + bar | uppercase`, i.e. `$scope.$watch("foo + ' ' + bar | uppercase", function () { /* body */ });`. The callback will be triggered each time the value of the expression change. In the current case the callback will update the value of the span.
1318
+
-->
1280
1319
1320
+
下面是 `$watch` 函数实现的头几行:
1321
+
<!--
1281
1322
Here are the first a couple of lines of the implementation of `$watch`:
We can think of the `watcher` object as a command. The expression of the command is being evaluated on each [`"$digest"`](https://docs.angularjs.org/api/ng/type/$rootScope.Scope#$digest) loop. Once AngularJS detects change in the expression, it invokes the `listener` function. The `watcher` command encapsulates the whole information required for watching given expression and delegates the execution of the command to the `listener` (the actual receiver). We can think of the `$scope` as the command's `Client` and the `$digest` loop as the command's `Invoker`.
0 commit comments