Compare commits
58 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| a3eb6baf58 | |||
| f4fcaa8757 | |||
| 40e34a924b | |||
| 90f87072e8 | |||
| c785918cbd | |||
| 8425e9fe38 | |||
| 94764ee089 | |||
| 04492ef227 | |||
| c6016a6a85 | |||
| 977e2f55de | |||
| 4184ff8ff7 | |||
| f3d4fe6209 | |||
| 9e5cd92fa9 | |||
| c07f1e1c9f | |||
| fd7bca22e1 | |||
| 8f283fe473 | |||
| cb8061c75c | |||
| b1366c32d4 | |||
| b122194425 | |||
| 089bf5f0e3 | |||
| f6fa7c9c95 | |||
| 938b2e1217 | |||
| dbc6696b68 | |||
| 5d632af926 | |||
| ed9e570a12 | |||
| d7ed885984 | |||
| 4ab16aaaf7 | |||
| 89f435de84 | |||
| bcc6e8d4f6 | |||
| b2137c9fdf | |||
| bee56a82b0 | |||
| bcdbfdfeae | |||
| afbed10feb | |||
| f69ee170ed | |||
| a59976be18 | |||
| 40d1e10520 | |||
| 5bf81bc111 | |||
| 96ad0c7594 | |||
| 717a6705e2 | |||
| 37ac4724ba | |||
| 8c18ef67cf | |||
| dfe6400537 | |||
| f925e8caa6 | |||
| e1254b266d | |||
| fa82a31fa6 | |||
| 4612705ec2 | |||
| 9577702e8d | |||
| a61b65d01b | |||
| fb483d56a7 | |||
| c5c75386e4 | |||
| 2734b9f560 | |||
| dcdbcaf2b5 | |||
| 9a8179d311 | |||
| 44fe7b6dbb | |||
| 95102a5afe | |||
| ae2cdeb2de | |||
| 6a0aff84c4 | |||
| e4181182dd |
+285
@@ -1,3 +1,288 @@
|
||||
<a name="1.2.1"></a>
|
||||
# 1.2.1 underscore-empathy (2013-11-14)
|
||||
|
||||
|
||||
## Bug Fixes
|
||||
|
||||
- **$compile:**
|
||||
- accessing controllers of transcluded directives from children
|
||||
([90f87072](https://github.com/angular/angular.js/commit/90f87072e83234ae366cfeb3c281503c31dad738),
|
||||
[#4935](https://github.com/angular/angular.js/issues/4935))
|
||||
- correctly handle interpolated style in replace templates
|
||||
([e1254b26](https://github.com/angular/angular.js/commit/e1254b266dfa2d4e3756e4317152dbdbcabe44be),
|
||||
[#4882](https://github.com/angular/angular.js/issues/4882))
|
||||
- **$resource:** don't use $parse for @dotted.member
|
||||
([9577702e](https://github.com/angular/angular.js/commit/9577702e8d2519c1a60f5ac4058e63bd7b919815))
|
||||
- **bootstrap:** make IE8 happy
|
||||
([a61b65d0](https://github.com/angular/angular.js/commit/a61b65d01b468502fe53d68818949d3fcc9f20f6))
|
||||
- **loader:** don't rely on internal APIs
|
||||
([8425e9fe](https://github.com/angular/angular.js/commit/8425e9fe383c17f6a5589c778658c5fc0570ae8f),
|
||||
[#4437](https://github.com/angular/angular.js/issues/4437), [#4874](https://github.com/angular/angular.js/issues/4874))
|
||||
- **minErr:** remove references to internal APIs
|
||||
([94764ee0](https://github.com/angular/angular.js/commit/94764ee08910726db1db7a1101c3001500306dea))
|
||||
- **ngIf:** don't create multiple elements when changing from a truthy value to another thruthy value
|
||||
([4612705e](https://github.com/angular/angular.js/commit/4612705ec297bc6ba714cb7a98f1be6aff77c4b8),
|
||||
[#4852](https://github.com/angular/angular.js/issues/4852))
|
||||
- **urlUtils:**
|
||||
- make removal of windows drive from path safer
|
||||
([89f435de](https://github.com/angular/angular.js/commit/89f435de847635e3ec339726e6f83cf3f0ee9091),
|
||||
[#4939](https://github.com/angular/angular.js/issues/4939))
|
||||
- return right path for file:// on windows
|
||||
([f925e8ca](https://github.com/angular/angular.js/commit/f925e8caa6c51a7d45ca9ead30601ec2e9d4464c),
|
||||
[#4680](https://github.com/angular/angular.js/issues/4680))
|
||||
|
||||
|
||||
## Features
|
||||
|
||||
- **$parse:** revert hiding "private" properties
|
||||
([4ab16aaa](https://github.com/angular/angular.js/commit/4ab16aaaf762e9038803da1f967ac8cb6650727d),
|
||||
[#4926](https://github.com/angular/angular.js/issues/4926), [#4842](https://github.com/angular/angular.js/issues/4842), [#4865](https://github.com/angular/angular.js/issues/4865), [#4859](https://github.com/angular/angular.js/issues/4859), [#4849](https://github.com/angular/angular.js/issues/4849))
|
||||
|
||||
|
||||
|
||||
<a name="1.2.0"></a>
|
||||
# 1.2.0 timely-delivery (2013-11-08)
|
||||
|
||||
|
||||
|
||||
## Features
|
||||
|
||||
|
||||
- **animations:**
|
||||
- ensure CSS transitions can work with inherited CSS class definitions
|
||||
([9d69a0a7](https://github.com/angular/angular.js/commit/9d69a0a7c75c937c0a49bb705d31252326b052df))
|
||||
- provide support for staggering animations with CSS
|
||||
([74848307](https://github.com/angular/angular.js/commit/74848307443c00ab07552336c56ddfa1e9ef6eff))
|
||||
- **$parse:** secure expressions by hiding "private" properties
|
||||
([3d6a89e8](https://github.com/angular/angular.js/commit/3d6a89e8888b14ae5cb5640464e12b7811853c7e))
|
||||
- **docs:**
|
||||
- provide index pages for each angular module
|
||||
([a7e12b79](https://github.com/angular/angular.js/commit/a7e12b7959212f2fa88fe17d5a045cc9d8b22922))
|
||||
- add forward slash shortcut key for search bar
|
||||
([74912802](https://github.com/angular/angular.js/commit/74912802c644ca929e39a7583cb7a9a05f12e91f))
|
||||
- **jqLite:** expose isolateScope() getter similar to scope()
|
||||
([27e9340b](https://github.com/angular/angular.js/commit/27e9340b3c25b512e45213b39811098d07e12e3b))
|
||||
- **misc:** add externs file for Closure Compiler
|
||||
([9d0a6977](https://github.com/angular/angular.js/commit/9d0a69772c39bfc751ca2000c3b4b3381e51fe93))
|
||||
|
||||
|
||||
|
||||
## Bug Fixes
|
||||
|
||||
- **$animate:**
|
||||
- don't force animations to be enabled
|
||||
([98adc9e0](https://github.com/angular/angular.js/commit/98adc9e0383dc05efad168f30a0725cb67f5eda8))
|
||||
- only apply the fallback property if any transition animations are detected
|
||||
([94700807](https://github.com/angular/angular.js/commit/9470080762aecca5285d0f5cac4ae01540bbad4c))
|
||||
- avoid hanging animations if the active CSS transition class is missing
|
||||
([b89584db](https://github.com/angular/angular.js/commit/b89584db10b63f346cbfd03f67fb92504e5bf362),
|
||||
[#4732](https://github.com/angular/angular.js/issues/4732), [#4490](https://github.com/angular/angular.js/issues/4490))
|
||||
- ensure staggering animations understand multiple delay values
|
||||
([41a2d5b3](https://github.com/angular/angular.js/commit/41a2d5b30f4feb90651eb577cf44852a6d2be72c))
|
||||
- ensure the active class is not applied if cancelled during reflow
|
||||
([e53ff431](https://github.com/angular/angular.js/commit/e53ff431e1472c0b2d5405d267d4e403ca31087e),
|
||||
[#4699](https://github.com/angular/angular.js/issues/4699))
|
||||
- use direct DOM comparison when checking for $rootElement
|
||||
([d434eabe](https://github.com/angular/angular.js/commit/d434eabec3955f8d56c859c93befe711bfa1de27),
|
||||
[#4679](https://github.com/angular/angular.js/issues/4679))
|
||||
- ensure former nodes are fully cleaned up when a follow-up structural animation takes place
|
||||
([7f0767ac](https://github.com/angular/angular.js/commit/7f0767acaba1ec3c8849244a604b0d1c8c376446),
|
||||
[#4435](https://github.com/angular/angular.js/issues/4435))
|
||||
- ensure enable/disable animations work when the document node is used
|
||||
([6818542c](https://github.com/angular/angular.js/commit/6818542c694aec6c811fb2fe2f86f7d16544c39b),
|
||||
[#4669](https://github.com/angular/angular.js/issues/4669))
|
||||
- skip unnecessary addClass/removeClass animations
|
||||
([76b628bc](https://github.com/angular/angular.js/commit/76b628bcb3511210d312ed667e5c14d908a9fed1),
|
||||
[#4401](https://github.com/angular/angular.js/issues/4401), [#2332](https://github.com/angular/angular.js/issues/2332))
|
||||
- ensure animations work properly when the $rootElement is being animated
|
||||
([2623de14](https://github.com/angular/angular.js/commit/2623de1426219dc799f63a3d155911f93fc03461),
|
||||
[#4397](https://github.com/angular/angular.js/issues/4397), [#4231](https://github.com/angular/angular.js/issues/4231))
|
||||
- only cancel class-based animations if the follow-up class contains CSS transition/keyframe animation code
|
||||
([f5289fe8](https://github.com/angular/angular.js/commit/f5289fe84ffc1f2368dae7bd14c420abbe76749e),
|
||||
[#4463](https://github.com/angular/angular.js/issues/4463), [#3784](https://github.com/angular/angular.js/issues/3784))
|
||||
- **$compile:**
|
||||
- don't leak isolate scope state when replaced directive is used multiple times
|
||||
([b5af198f](https://github.com/angular/angular.js/commit/b5af198f0d5b0f2b3ddb31ea12f700f3e0616271))
|
||||
- correct isolate scope distribution to controllers
|
||||
([3fe4491a](https://github.com/angular/angular.js/commit/3fe4491a6bf57ddeb312b8a30cf1706f6f1d2355))
|
||||
- replaced element has isolate scope
|
||||
([97c7a4e3](https://github.com/angular/angular.js/commit/97c7a4e3791d7cb05c3317cc5f0c49ab93810bf6))
|
||||
- only pass isolate scope to children that belong to the isolate directive
|
||||
([d0efd5ee](https://github.com/angular/angular.js/commit/d0efd5eefcc0aaf167c766513e152b74dd31bafe))
|
||||
- make isolate scope truly isolate
|
||||
([909cabd3](https://github.com/angular/angular.js/commit/909cabd36d779598763cc358979ecd85bb40d4d7),
|
||||
[#1924](https://github.com/angular/angular.js/issues/1924), [#2500](https://github.com/angular/angular.js/issues/2500))
|
||||
- don't instantiate controllers twice for element transclude directives
|
||||
([18ae985c](https://github.com/angular/angular.js/commit/18ae985c3a3147b589c22f6ec21bacad2f578e2b),
|
||||
[#4654](https://github.com/angular/angular.js/issues/4654))
|
||||
- attribute bindings should not break due to terminal directives
|
||||
([79223eae](https://github.com/angular/angular.js/commit/79223eae5022838893342c42dacad5eca83fabe8),
|
||||
[#4525](https://github.com/angular/angular.js/issues/4525), [#4528](https://github.com/angular/angular.js/issues/4528), [#4649](https://github.com/angular/angular.js/issues/4649))
|
||||
- instantiate controlers when re-entering compilation
|
||||
([faf5b980](https://github.com/angular/angular.js/commit/faf5b980da09da2b4c28f1feab33f87269f9f0ba),
|
||||
[#4434](https://github.com/angular/angular.js/issues/4434), [#4616](https://github.com/angular/angular.js/issues/4616))
|
||||
- **$injector:** allow a constructor function to return a function
|
||||
([c22adbf1](https://github.com/angular/angular.js/commit/c22adbf160f32c1839fbb35382b7a8c6bcec2927))
|
||||
- **$parse:** check function call context to be safe
|
||||
([6d324c76](https://github.com/angular/angular.js/commit/6d324c76f0d3ad7dae69ce01b14e0564938fb15e),
|
||||
[#4417](https://github.com/angular/angular.js/issues/4417))
|
||||
- **angular-mocks:** add inline dependency annotation
|
||||
([6d23591c](https://github.com/angular/angular.js/commit/6d23591c31f2b41097ceaa380af09998e4a62f09),
|
||||
[#4448](https://github.com/angular/angular.js/issues/4448))
|
||||
- **animateSpec:** run digest to enable animations before tests
|
||||
([aea76f0d](https://github.com/angular/angular.js/commit/aea76f0d5c43dc17f1319d0a45d2ce50fddf72e4))
|
||||
- **bootstrap-prettify:** share $animate and $$postDigestQueue with demo apps
|
||||
([1df3da36](https://github.com/angular/angular.js/commit/1df3da361d62726bf1dafe629a7fca845b6a8733))
|
||||
- **csp:**
|
||||
- fix csp auto-detection and stylesheet injection
|
||||
([08f376f2](https://github.com/angular/angular.js/commit/08f376f2ea3d3bb384f10e3c01f7d48ed21ce351),
|
||||
[#917](https://github.com/angular/angular.js/issues/917), [#2963](https://github.com/angular/angular.js/issues/2963), [#4394](https://github.com/angular/angular.js/issues/4394), [#4444](https://github.com/angular/angular.js/issues/4444))
|
||||
- don't inline css in csp mode
|
||||
([a86cf20e](https://github.com/angular/angular.js/commit/a86cf20e67202d614bbcaf038c5e04db94483256)
|
||||
- **docModuleComponents:** implement anchor scroll when content added
|
||||
([eb51b024](https://github.com/angular/angular.js/commit/eb51b024c9b77527420014cdf7dbb292b5b9dd6b),
|
||||
[#4703](https://github.com/angular/angular.js/issues/4703))
|
||||
- **input:** keep track of min/max attars on-the-fly
|
||||
([4b653aea](https://github.com/angular/angular.js/commit/4b653aeac1aca7ac551738870a2446b6810ca0df))
|
||||
- **ngAnimate:** fix cancelChildAnimations throwing exception
|
||||
([b9557b0a](https://github.com/angular/angular.js/commit/b9557b0a86206d938a738ea470736d011dff7e1a),
|
||||
[#4548](https://github.com/angular/angular.js/issues/4548))
|
||||
- **ngClassSpec:** clear animation enable fn from postDigestQueue
|
||||
([ffa9d0a6](https://github.com/angular/angular.js/commit/ffa9d0a6db137cba4090e569b8ed4e25a711314e))
|
||||
- **ngEventDirectives:** parse expression only once during compile phase.
|
||||
([9a828738](https://github.com/angular/angular.js/commit/9a828738cd2e959bc2a198989e96c8e416d28b71))
|
||||
- **ngIf:**
|
||||
- destroy child scope when destroying DOM
|
||||
([9483373c](https://github.com/angular/angular.js/commit/9483373c331343648e079420b3eb1f564d410ff2))
|
||||
- ngIf removes elements dynamically added to it
|
||||
([e19067c9](https://github.com/angular/angular.js/commit/e19067c9bbac3c3bb450c80f73eb5518bd0db1a1))
|
||||
- **ngInclude:** only run anchorScroll after animation is done
|
||||
([d378f550](https://github.com/angular/angular.js/commit/d378f5500ab2eef0779338336c6a95656505ebb8),
|
||||
[#4723](https://github.com/angular/angular.js/issues/4723))
|
||||
- **ngMock:** throw more descriptive errors for $animate.flushNext()
|
||||
([6fb19157](https://github.com/angular/angular.js/commit/6fb191570ee72f087e8bb6b1d8f5eea0f585886c))
|
||||
- **ngModel:** deregister from the form on scope not DOM destruction
|
||||
([8f989d65](https://github.com/angular/angular.js/commit/8f989d652f70fd147f66a18411070c7b939e242e),
|
||||
[#4226](https://github.com/angular/angular.js/issues/4226), [#4779](https://github.com/angular/angular.js/issues/4779))
|
||||
- **ngScenario:** correctly disable animations for end 2 end tests
|
||||
([9d004585](https://github.com/angular/angular.js/commit/9d0045856351e9db48ddf66f66e210d9cc53d24a))
|
||||
- **ngView:**
|
||||
- only run anchorScroll after animation is done
|
||||
([da344daa](https://github.com/angular/angular.js/commit/da344daa4023556f8abbef6d8ad87a16362b5861))
|
||||
- ensure the new view element is placed after the old view element
|
||||
([3f568b22](https://github.com/angular/angular.js/commit/3f568b22f9bec09192588e3cae937db5c2e757f9),
|
||||
[#4362](https://github.com/angular/angular.js/issues/4362))
|
||||
- **ngdocs:**
|
||||
- create mock Doc objects correctly
|
||||
([d4493fda](https://github.com/angular/angular.js/commit/d4493fda2c4c2ff1fdfc264bfb479741abc781c7))
|
||||
- `shortDescription()` should not error if no `description`
|
||||
([4c8fa353](https://github.com/angular/angular.js/commit/4c8fa353245b9c32261860caff18f002d294e19f))
|
||||
- remove the side search bar
|
||||
([6c20ec19](https://github.com/angular/angular.js/commit/6c20ec193f11aa647be1b2ad2ac5b3e7c2894bd7))
|
||||
|
||||
|
||||
|
||||
## Breaking Changes
|
||||
|
||||
- **$compile:**
|
||||
- due to [d0efd5ee](https://github.com/angular/angular.js/commit/d0efd5eefcc0aaf167c766513e152b74dd31bafe),
|
||||
Child elements that are defined either in the application template or in some other
|
||||
directives template do not get the isolate scope. In theory, nobody should rely on this behavior, as
|
||||
it is very rare - in most cases the isolate directive has a template.
|
||||
|
||||
- due to [909cabd3](https://github.com/angular/angular.js/commit/909cabd36d779598763cc358979ecd85bb40d4d7),
|
||||
Directives without isolate scope do not get the isolate scope from an isolate directive on the
|
||||
same element. If your code depends on this behavior (non-isolate directive needs to access state
|
||||
from within the isolate scope), change the isolate directive to use scope locals to pass these explicitly.
|
||||
|
||||
**Before**
|
||||
|
||||
```
|
||||
<input ng-model="$parent.value" ng-isolate>
|
||||
|
||||
.directive('ngIsolate', function() {
|
||||
return {
|
||||
scope: {},
|
||||
template: '{{value}}'
|
||||
};
|
||||
});
|
||||
```
|
||||
|
||||
**After**
|
||||
|
||||
```
|
||||
<input ng-model="value" ng-isolate>
|
||||
|
||||
.directive('ngIsolate', function() {
|
||||
return {
|
||||
scope: {value: '=ngModel'},
|
||||
template: '{{value}}
|
||||
};
|
||||
});
|
||||
```
|
||||
|
||||
Closes [#1924](https://github.com/angular/angular.js/issues/1924) and
|
||||
[#2500](https://github.com/angular/angular.js/issues/2500)
|
||||
|
||||
- due to [79223eae](https://github.com/angular/angular.js/commit/79223eae5022838893342c42dacad5eca83fabe8),
|
||||
|
||||
Previously, the interpolation priority was `-100` in 1.2.0-rc.2, and `100` before 1.2.0-rc.2.
|
||||
Before this change the binding was setup in the post-linking phase.
|
||||
|
||||
Now the attribute interpolation (binding) executes as a directive with priority 100 and the
|
||||
binding is set up in the pre-linking phase.
|
||||
|
||||
Closes [#4525](https://github.com/angular/angular.js/issues/4525),
|
||||
[#4528](https://github.com/angular/angular.js/issues/4528), and
|
||||
[#4649](https://github.com/angular/angular.js/issues/4649)
|
||||
|
||||
|
||||
- **$parse:** due to [3d6a89e8](https://github.com/angular/angular.js/commit/3d6a89e8888b14ae5cb5640464e12b7811853c7e),
|
||||
|
||||
This commit introduces the notion of "private" properties (properties
|
||||
whose names begin and/or end with an underscore) on the scope chain.
|
||||
These properties will not be available to Angular expressions (i.e. {{
|
||||
}} interpolation in templates and strings passed to `$parse`) They are
|
||||
freely available to JavaScript code (as before).
|
||||
|
||||
**Motivation**
|
||||
|
||||
Angular expressions execute in a limited context. They do not have
|
||||
direct access to the global scope, `window`, `document` or the Function
|
||||
constructor. However, they have direct access to names/properties on
|
||||
the scope chain. It has been a long standing best practice to keep
|
||||
sensitive APIs outside of the scope chain (in a closure or your
|
||||
controller.) That's easier said that done for two reasons:
|
||||
|
||||
1. JavaScript does not have a notion of private properties so if you need
|
||||
someone on the scope chain for JavaScript use, you also expose it to
|
||||
Angular expressions
|
||||
2. the new "controller as" syntax that's now in increased usage exposes the
|
||||
entire controller on the scope chain greatly increaing the exposed surface.
|
||||
|
||||
Though Angular expressions are written and controlled by the developer, they:
|
||||
|
||||
1. Typically deal with user input
|
||||
2. Don't get the kind of test coverage that JavaScript code would
|
||||
|
||||
This commit provides a way, via a naming convention, to
|
||||
allow publishing/restricting properties from controllers/scopes to
|
||||
Angular expressions enabling one to only expose those properties that
|
||||
are actually needed by the expressions.
|
||||
|
||||
- **csp:** due to [08f376f2](https://github.com/angular/angular.js/commit/08f376f2ea3d3bb384f10e3c01f7d48ed21ce351),
|
||||
triggering ngCsp directive via `ng:csp` attribute is not supported any more.
|
||||
Please use `data-ng-csp` instead.
|
||||
|
||||
- **jqLite:** due to [27e9340b](https://github.com/angular/angular.js/commit/27e9340b3c25b512e45213b39811098d07e12e3b),
|
||||
`jqLite.scope()` (connonly used through `angular.element(node).scope()`) does not return the
|
||||
isolate scope on the element that triggered directive with isolate scope. Use
|
||||
`jqLite.isolateScope()` instead.
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<a name="1.2.0-rc.3"></a>
|
||||
# 1.2.0-rc.3 ferocious-twitch (2013-10-14)
|
||||
|
||||
|
||||
Vendored
+1
@@ -66,6 +66,7 @@ angularFiles = {
|
||||
],
|
||||
|
||||
'angularLoader': [
|
||||
'src/minErr.js',
|
||||
'src/loader.js'
|
||||
],
|
||||
|
||||
|
||||
+1
-1
@@ -193,7 +193,7 @@ directive.table = function() {
|
||||
return {
|
||||
restrict: 'E',
|
||||
link: function(scope, element, attrs) {
|
||||
if (!attrs.class) {
|
||||
if (!attrs['class']) {
|
||||
element.addClass('table table-bordered table-striped code-table');
|
||||
}
|
||||
}
|
||||
|
||||
@@ -6,7 +6,7 @@
|
||||
When a directive is declared with `template` (or `templateUrl`) and `replace` mode on, the template
|
||||
must have exactly one root element. That is, the text of the template property or the content
|
||||
referenced by the templateUrl must be contained within a single html element.
|
||||
For example, '<p>blah <em>blah</em> blah</p>' instead of simply 'blah <em>blah</em> blah'.
|
||||
For example, `<p>blah <em>blah</em> blah</p>` instead of simply `blah <em>blah</em> blah`.
|
||||
Otherwise, the replacement operation would result in a single element (the directive) being replaced
|
||||
with multiple elements or nodes, which is unsupported and not commonly needed in practice.
|
||||
|
||||
|
||||
@@ -1,50 +0,0 @@
|
||||
@ngdoc error
|
||||
@name $parse:isecprv
|
||||
@fullName Referencing private Field in Expression
|
||||
|
||||
@description
|
||||
|
||||
Occurs when an Angular expression attempts to access a private field.
|
||||
|
||||
Fields with names that begin or end with an underscore are considered
|
||||
private fields. Angular expressions are not allowed to reference such
|
||||
fields on the scope chain. This only applies to Angular expressions
|
||||
(e.g. {{ }} interpolation and calls to `$parse` with a string expression
|
||||
argument) – Javascript itself has no such notion.
|
||||
|
||||
To resolve this error, use an alternate non-private field if available
|
||||
or make the field public (by removing any leading and trailing
|
||||
underscore characters from its name.)
|
||||
|
||||
Example expression that would result in this error:
|
||||
|
||||
```html
|
||||
<div>{{user._private_field}}</div>
|
||||
```
|
||||
|
||||
Background:
|
||||
Though Angular expressions are written and controlled by the developer
|
||||
and are trusted, they do represent an attack surface due to the
|
||||
following two factors:
|
||||
|
||||
- they typically deal with user input which is generally high risk
|
||||
- they often don't get the kind of attention and test coverage that
|
||||
JavaScript code would.
|
||||
|
||||
If these expression were evaluated in a context with full trust, an
|
||||
attacker, though unable to change the expression itself, can feed it
|
||||
unexpected and dangerous input that could result in a security
|
||||
breach/exploit.
|
||||
|
||||
As such, Angular expressions are evaluated in a limited context. They
|
||||
do not have direct access to the global scope, Window, Document, the
|
||||
Function constructor or "private" properties (names beginning or ending
|
||||
with an underscore character) on the scope chain. They should get their
|
||||
work done via public properties and methods exposed on the scope chain
|
||||
(keep in mind that this includes controllers as well as they are
|
||||
published on the scope via the "controller as" syntax.)
|
||||
|
||||
As a best practise, only "publish" properties on the scopes and
|
||||
controllers that must be available to Angular expressions. All other
|
||||
members should either be in closures or be "private" by giving them
|
||||
names with a leading or trailing underscore character.
|
||||
@@ -0,0 +1,27 @@
|
||||
@ngdoc error
|
||||
@name $resource:badmember
|
||||
@fullName Syntax error in param value using @member lookup
|
||||
@description
|
||||
|
||||
Occurs when there is a syntax error when attempting to extract a param
|
||||
value from the data object.
|
||||
|
||||
Here's an example of valid syntax for `params` or `paramsDefault`:
|
||||
|
||||
````javascript
|
||||
{
|
||||
bar: '@foo.bar'
|
||||
}
|
||||
````
|
||||
|
||||
The part following the `@`, `foo.bar` in this case, should be a simple
|
||||
dotted member lookup using only ASCII identifiers. This error occurs
|
||||
when there is an error in that expression. The following are all syntax
|
||||
errors
|
||||
|
||||
| Value | Error |
|
||||
|---------|----------------|
|
||||
| `@` | Empty expression following `@`. |
|
||||
| `@1.a` | `1` is an invalid javascript identifier. |
|
||||
| `@.a` | Leading `.` is invalid. |
|
||||
| `@a[1]` | Only dotted lookups are supported (no index operator) |
|
||||
@@ -12,7 +12,7 @@ For a more in-depth explanation, have a look at the {@link tutorial/ tutorial}.
|
||||
|{@link concepts#template Template} | HTML with additional markup |
|
||||
|{@link concepts#directive Directives} | extend HTML with custom attributes and elements |
|
||||
|{@link concepts#model Model} | the data that is shown to the user and with which the user interacts |
|
||||
|{@link concepts#scope Scope} | context where the model is stored so that directives and expressions can access it |
|
||||
|{@link concepts#scope Scope} | context where the model is stored so that controllers, directives and expressions can access it |
|
||||
|{@link concepts#expression Expressions} | access variables and functions from the scope |
|
||||
|{@link concepts#compiler Compiler} | parses the template and instantiates directives and expressions |
|
||||
|{@link concepts#filter Filter} | formats the value of an expression for display to the user |
|
||||
@@ -99,8 +99,8 @@ The concept behind this is <a name="databinding">"{@link databinding two-way dat
|
||||
|
||||
# Adding UI logic: Controllers
|
||||
|
||||
Let's add some more logic to the example to
|
||||
allow to enter and calculate the costs in different currencies and also pay the invoice.
|
||||
Let's add some more logic to the example that allows us to enter and calculate the costs in
|
||||
different currencies and also pay the invoice.
|
||||
|
||||
<example module="invoice1">
|
||||
<file name="invoice1.js">
|
||||
|
||||
@@ -200,7 +200,7 @@ previous example.
|
||||
|
||||
Notice that the `SpicyCtrl` Controller now defines just one method called `spicy`, which takes one
|
||||
argument called `spice`. The template then refers to this Controller method and passes in a string
|
||||
constant `'chili'` in the binding for the first button and a model property `spice` (bound to an
|
||||
constant `'chili'` in the binding for the first button and a model property `customSpice` (bound to an
|
||||
input box) in the second button.
|
||||
|
||||
## Scope Inheritance Example
|
||||
|
||||
@@ -94,14 +94,16 @@ Here are some equivalent examples of elements that match `ngBind`:
|
||||
|
||||
<div class="alert alert-success">
|
||||
**Best Practice:** Prefer using the dash-delimited format (e.g. `ng-bind` for `ngBind`).
|
||||
If you want to use an HTML validating tool, you can instead use the `data`-prefixed version (e.g. `data-ng-bind` for `ngBind`).
|
||||
If you want to use an HTML validating tool, you can instead use the `data`-prefixed version (e.g.
|
||||
`data-ng-bind` for `ngBind`).
|
||||
The other forms shown above are accepted for legacy reasons but we advise you to avoid them.
|
||||
</div>
|
||||
|
||||
`$compile` can match directives based on element names, attributes, class names, as well as comments.
|
||||
|
||||
All of the Angular-provided directives match attribute name, tag name, comments, or class name.
|
||||
The following demonstrates the various ways a directive (`myDir` in this case) can be referenced from within a template:
|
||||
The following demonstrates the various ways a directive (`myDir` in this case) can be referenced
|
||||
from within a template:
|
||||
|
||||
```html
|
||||
<my-dir></my-dir>
|
||||
@@ -116,20 +118,22 @@ Doing so generally makes it easier to determine what directives a given element
|
||||
</div>
|
||||
|
||||
<div class="alert alert-success">
|
||||
**Best Practice:** Comment directives were commonly used in places where the DOM API limits (e.g. inside `<table>` elements)
|
||||
to create directives that spanned multiple elements. AngularJS 1.2 introduces
|
||||
{@link api/ng.directive:ngRepeat `ng-repeat-start` and `ng-repeat-end`} as a better solution to this problem.
|
||||
Developers are encouraged to use this over custom comment directives when possible.
|
||||
**Best Practice:** Comment directives were commonly used in places where the DOM API limits the
|
||||
ability to create directives that spanned multiple elements (e.g. inside `<table>` elements).
|
||||
AngularJS 1.2 introduces {@link api/ng.directive:ngRepeat `ng-repeat-start` and `ng-repeat-end`}
|
||||
as a better solution to this problem. Developers are encouraged to use this over custom comment
|
||||
directives when possible.
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
### Text and attribute bindings
|
||||
|
||||
During the compilation process the {@link api/ng.$compile compiler} matches text and attributes using the
|
||||
{@link api/ng.$interpolate $interpolate} service to see if they contain embedded expressions. These expressions
|
||||
are registered as {@link api/ng.$rootScope.Scope#methods_$watch watches} and will update as part of normal {@link
|
||||
api/ng.$rootScope.Scope#methods_$digest digest} cycle. An example of interpolation is shown below:
|
||||
During the compilation process the {@link api/ng.$compile compiler} matches text and attributes
|
||||
using the {@link api/ng.$interpolate $interpolate} service to see if they contain embedded
|
||||
expressions. These expressions are registered as {@link api/ng.$rootScope.Scope#methods_$watch watches}
|
||||
and will update as part of normal {@link api/ng.$rootScope.Scope#methods_$digest digest} cycle. An
|
||||
example of interpolation is shown below:
|
||||
|
||||
```html
|
||||
<a ng-href="img/{{username}}.jpg">Hello {{username}}!</a>
|
||||
@@ -149,8 +153,8 @@ For example, considering this template:
|
||||
```
|
||||
|
||||
We would expect Angular to be able to bind to this, but when we check the console we see
|
||||
something like `Error: Invalid value for attribute cx="{{cx}}"`. Because of the SVG DOM API's restrictions,
|
||||
you cannot simply write `cx="{{cx}}"`.
|
||||
something like `Error: Invalid value for attribute cx="{{cx}}"`. Because of the SVG DOM API's
|
||||
restrictions, you cannot simply write `cx="{{cx}}"`.
|
||||
|
||||
With `ng-attr-cx` you can work around this problem.
|
||||
|
||||
@@ -170,18 +174,19 @@ For example, we could fix the example above by instead writing:
|
||||
|
||||
## Creating Directives
|
||||
|
||||
First let's talk about the API for registering directives. Much like controllers, directives are registered on
|
||||
modules. To register a directive, you use the `module.directive` API. `module.directive` takes the
|
||||
{@link guide/directive#creating-custom-directives_matching-directives normalized} directive name followed
|
||||
by a **factory function.** This factory function should return
|
||||
an object with the different options to tell `$compile` how the directive should behave when matched.
|
||||
First let's talk about the API for registering directives. Much like controllers, directives are
|
||||
registered on modules. To register a directive, you use the `module.directive` API.
|
||||
`module.directive` takes the
|
||||
{@link guide/directive#creating-custom-directives_matching-directives normalized} directive name
|
||||
followed by a **factory function.** This factory function should return an object with the different
|
||||
options to tell `$compile` how the directive should behave when matched.
|
||||
|
||||
|
||||
The factory function is invoked only once when the
|
||||
{@link api/ng.$compile compiler} matches the directive for the first time. You can
|
||||
perform any initialization work here. The function is invoked using {@link
|
||||
api/AUTO.$injector#methods_invoke $injector.invoke} which
|
||||
makes it injectable just like a controller.
|
||||
{@link api/ng.$compile compiler} matches the directive for the first time. You can perform any
|
||||
initialization work here. The function is invoked using
|
||||
{@link api/AUTO.$injector#methods_invoke $injector.invoke} which makes it injectable just like a
|
||||
controller.
|
||||
|
||||
<div class="alert alert-success">
|
||||
**Best Practice:** Prefer using the definition object over returning a function.
|
||||
@@ -204,9 +209,9 @@ For the following examples, we'll use the prefix `my` (e.g. `myCustomer`).
|
||||
|
||||
### Template-expanding directive
|
||||
|
||||
Let's say you have a chunk of your template that represents a customer's information. This template is repeated
|
||||
many times in your code. When you change it in one place, you have to change it in several others. This is a
|
||||
good opportunity to use a directive to simplify your template.
|
||||
Let's say you have a chunk of your template that represents a customer's information. This template
|
||||
is repeated many times in your code. When you change it in one place, you have to change it in
|
||||
several others. This is a good opportunity to use a directive to simplify your template.
|
||||
|
||||
Let's create a directive that simply replaces its contents with a static template:
|
||||
|
||||
@@ -232,21 +237,22 @@ Let's create a directive that simply replaces its contents with a static templat
|
||||
</file>
|
||||
</example>
|
||||
|
||||
Notice that we have bindings in this directive. After `$compile` compiles and links `<div my-customer></div>`,
|
||||
it will try to match directives on the element's children. This means you can compose directives of other directives.
|
||||
We'll see how to do that in {@link
|
||||
guide/directive#creating-custom-directives_demo_creating-directives-that-communicate an example} below.
|
||||
Notice that we have bindings in this directive. After `$compile` compiles and links
|
||||
`<div my-customer></div>`, it will try to match directives on the element's children. This means you
|
||||
can compose directives of other directives. We'll see how to do that in
|
||||
{@link guide/directive#creating-custom-directives_demo_creating-directives-that-communicate an example}
|
||||
below.
|
||||
|
||||
In the example above we in-lined the value of the `template` option, but this will become annoying as the size
|
||||
of your template grows.
|
||||
In the example above we in-lined the value of the `template` option, but this will become annoying
|
||||
as the size of your template grows.
|
||||
|
||||
<div class="alert alert-success">
|
||||
**Best Practice:** Unless your template is very small, it's typically better to break it apart into its own
|
||||
HTML file and load it with the `templateUrl` option.
|
||||
**Best Practice:** Unless your template is very small, it's typically better to break it apart into
|
||||
its own HTML file and load it with the `templateUrl` option.
|
||||
</div>
|
||||
|
||||
If you are familiar with `ngInclude`, `templateUrl` works just like it. Here's the same example using `templateUrl`
|
||||
instead:
|
||||
If you are familiar with `ngInclude`, `templateUrl` works just like it. Here's the same example
|
||||
using `templateUrl` instead:
|
||||
|
||||
<example module="docsTemplateUrlDirective">
|
||||
<file name="script.js">
|
||||
@@ -277,8 +283,8 @@ Great! But what if we wanted to have our directive match the tag name `<my-custo
|
||||
If we simply put a `<my-customer>` element into the HMTL, it doesn't work.
|
||||
|
||||
<div class="alert alert-waring">
|
||||
**Note:** When you create a directive, it is restricted to attribute only by default. In order to create
|
||||
directives that are triggered by element name, you need to use the `restrict` option.
|
||||
**Note:** When you create a directive, it is restricted to attribute only by default. In order to
|
||||
create directives that are triggered by element name, you need to use the `restrict` option.
|
||||
</div>
|
||||
|
||||
The `restrict` option is typically set to:
|
||||
@@ -317,28 +323,33 @@ Let's change our directive to use `restrict: 'E'`:
|
||||
</file>
|
||||
</example>
|
||||
|
||||
For more on the {@link api/ng.$compile#description_comprehensive-directive-api_directive-definition-object
|
||||
`restrict`, see the API docs}.
|
||||
For more on the
|
||||
{@link api/ng.$compile#description_comprehensive-directive-api_directive-definition-object `restrict`}
|
||||
property, see the
|
||||
{@link api/ng.$compile#description_comprehensive-directive-api_directive-definition-object API docs}.
|
||||
|
||||
<div class="alert alert-info">
|
||||
**When should I use an attribute versus an element?**
|
||||
|
||||
Use an element when you are creating a component that is in control of the template. The common case for this
|
||||
is when you are creating a Domain-Specific Language for parts of your template.
|
||||
Use an element when you are creating a component that is in control of the template. The common case
|
||||
for this is when you are creating a Domain-Specific Language for parts of your template.
|
||||
|
||||
Use an attribute when you are decorating an existing element with new functionality.
|
||||
</div>
|
||||
|
||||
Using an element for the `myCustomer` directive is clearly the right choice because you're not decorating an element
|
||||
with some "customer" behavior; you're defining the core behavior of the element as a customer component.
|
||||
Using an element for the `myCustomer` directive is clearly the right choice because you're not
|
||||
decorating an element with some "customer" behavior; you're defining the core behavior of the
|
||||
element as a customer component.
|
||||
|
||||
|
||||
|
||||
### Isolating the Scope of a Directive
|
||||
|
||||
Our `myCustomer` directive above is great, but it has a fatal flaw. We can only use it once within a given scope.
|
||||
Our `myCustomer` directive above is great, but it has a fatal flaw. We can only use it once within a
|
||||
given scope.
|
||||
|
||||
In its current implementation, we'd need to create a different controller each time In order to re-use such a directive:
|
||||
In its current implementation, we'd need to create a different controller each time In order to
|
||||
re-use such a directive:
|
||||
|
||||
<example module="docsScopeProblemExample">
|
||||
<file name="script.js">
|
||||
@@ -379,8 +390,8 @@ In its current implementation, we'd need to create a different controller each t
|
||||
This is clearly not a great solution.
|
||||
|
||||
What we want to be able to do is separate the scope inside a directive from the scope
|
||||
outside, and then map the outer scope to a directive's inner scope. We can do this by creating what we call an
|
||||
**isolate scope**. To do this, we can use a directive's `scope` option:
|
||||
outside, and then map the outer scope to a directive's inner scope. We can do this by creating what
|
||||
we call an **isolate scope**. To do this, we can use a directive's `scope` option:
|
||||
|
||||
<example module="docsIsolateScopeDirective">
|
||||
<file name="script.js">
|
||||
@@ -411,8 +422,8 @@ outside, and then map the outer scope to a directive's inner scope. We can do th
|
||||
</file>
|
||||
</example>
|
||||
|
||||
Looking at `index.html`, the first `<my-customer>` element binds the inner scope's `customer` to `naomi`,
|
||||
which we have exposed on our controller's scope. The second binds `customer` to `igor`.
|
||||
Looking at `index.html`, the first `<my-customer>` element binds the inner scope's `customer` to
|
||||
`naomi`, which we have exposed on our controller's scope. The second binds `customer` to `igor`.
|
||||
|
||||
Let's take a closer look at the scope option:
|
||||
|
||||
@@ -424,16 +435,18 @@ scope: {
|
||||
//...
|
||||
```
|
||||
|
||||
The property name (`customer`) corresponds to the variable name of the `myCustomer` directive's isolated scope.
|
||||
The value of the property (`=customer`) tells `$compile` to bind to the `customer` attribute.
|
||||
The property name (`customer`) corresponds to the variable name of the `myCustomer` directive's
|
||||
isolated scope. The value of the property (`=customer`) tells `$compile` to bind to the `customer`
|
||||
attribute.
|
||||
|
||||
<div class="alert alert-warning">
|
||||
**Note:** These `=attr` attributes in the `scope` option of directives are normalized just like directive names.
|
||||
To bind to the attribute in `<div bind-to-this="thing">`, you'd specify a binding of `=bindToThis`.
|
||||
**Note:** These `=attr` attributes in the `scope` option of directives are normalized just like
|
||||
directive names. To bind to the attribute in `<div bind-to-this="thing">`, you'd specify a binding
|
||||
of `=bindToThis`.
|
||||
</div>
|
||||
|
||||
For cases where the attribute name is the same as the value you want to bind to inside
|
||||
the directive's scope, you can use this shorthand syntax:
|
||||
For cases where the attribute name is the same as the value you want to bind to inside the
|
||||
directive's scope, you can use this shorthand syntax:
|
||||
|
||||
```javascript
|
||||
//...
|
||||
@@ -444,11 +457,11 @@ scope: {
|
||||
//...
|
||||
```
|
||||
|
||||
Besides making it possible to bind different data to the scope inside a directive, using an isolated scope has another
|
||||
effect.
|
||||
Besides making it possible to bind different data to the scope inside a directive, using an isolated
|
||||
scope has another effect.
|
||||
|
||||
We can show this by adding another property, `vojta`, to our scope and trying to access it
|
||||
from within our directive's template:
|
||||
We can show this by adding another property, `vojta`, to our scope and trying to access it from
|
||||
within our directive's template:
|
||||
|
||||
<example module="docsIsolationExample">
|
||||
<file name="script.js">
|
||||
@@ -504,7 +517,8 @@ In this example we will build a directive that displays the current time.
|
||||
Once a second, it updates the DOM to reflect the current time.
|
||||
|
||||
Directives that want to modify the DOM typically use the `link` option.
|
||||
`link` takes a function with the following signature, `function link(scope, element, attrs) { ... }` where:
|
||||
`link` takes a function with the following signature, `function link(scope, element, attrs) { ... }`
|
||||
where:
|
||||
|
||||
* `scope` is an Angular scope object.
|
||||
* `element` is the jqLite-wrapped element that this directive matches.
|
||||
@@ -565,8 +579,9 @@ if the directive is deleted so we don't introduce a memory leak.
|
||||
</example>
|
||||
|
||||
There are a couple of things to note here.
|
||||
Just like the `module.controller` API, the function argument in `module.directive` is dependency injected.
|
||||
Because of this, we can use `$timeout` and `dateFilter` inside our directive's `link` function.
|
||||
Just like the `module.controller` API, the function argument in `module.directive` is dependency
|
||||
injected. Because of this, we can use `$timeout` and `dateFilter` inside our directive's `link`
|
||||
function.
|
||||
|
||||
We register an event `element.on('$destroy', ...)`. What fires this `$destroy` event?
|
||||
|
||||
@@ -580,8 +595,9 @@ but if you registered a listener on a service, or registered a listener on a DOM
|
||||
being deleted, you'll have to clean it up yourself or you risk introducing a memory leak.
|
||||
|
||||
<div class="alert alert-success">
|
||||
**Best Practice:** Directives should clean up after themselves. You can use `element.on('$destroy', ...)`
|
||||
or `scope.$on('$destroy', ...)` to run a clean-up function when the directive is removed.
|
||||
**Best Practice:** Directives should clean up after themselves. You can use
|
||||
`element.on('$destroy', ...)` or `scope.$on('$destroy', ...)` to run a clean-up function when the
|
||||
directive is removed.
|
||||
</div>
|
||||
|
||||
|
||||
@@ -619,11 +635,11 @@ To do this, we need to use the `transclude` option.
|
||||
</file>
|
||||
</example>
|
||||
|
||||
What does this `transclude` option do, exactly? `transclude` makes the contents of a directive with this
|
||||
option have access to the scope **outside** of the directive rather than inside.
|
||||
What does this `transclude` option do, exactly? `transclude` makes the contents of a directive with
|
||||
this option have access to the scope **outside** of the directive rather than inside.
|
||||
|
||||
To illustrate this, see the example below. Notice that we've added a `link` function in `script.js` that
|
||||
redefines `name` as `Jeff`. What do you think the `{{name}}` binding will resolve to now?
|
||||
To illustrate this, see the example below. Notice that we've added a `link` function in `script.js`
|
||||
that redefines `name` as `Jeff`. What do you think the `{{name}}` binding will resolve to now?
|
||||
|
||||
<example module="docsTransclusionExample">
|
||||
<file name="script.js">
|
||||
@@ -669,11 +685,12 @@ pass in each model you wanted to use separately. If you have to pass in each mod
|
||||
use, then you can't really have arbitrary contents, can you?
|
||||
|
||||
<div class="alert alert-success">
|
||||
**Best Practice:** only use `transclude: true` when you want to create a directive that wraps arbitrary content.
|
||||
**Best Practice:** only use `transclude: true` when you want to create a directive that wraps
|
||||
arbitrary content.
|
||||
</div>
|
||||
|
||||
Next, we want to add buttons to this dialog box, and allow someone using the directive to bind their own
|
||||
behavior to it.
|
||||
Next, we want to add buttons to this dialog box, and allow someone using the directive to bind their
|
||||
own behavior to it.
|
||||
|
||||
<example module="docsIsoFnBindExample">
|
||||
<file name="script.js">
|
||||
@@ -893,5 +910,6 @@ point for creating your own directives.
|
||||
You might also be interested in an in-depth explanation of the compilation process that's
|
||||
available in the {@link guide/compiler compiler guide}.
|
||||
|
||||
The {@link api/ng.$compile `$compile` API} page has a comprehensive list of directive options for reference.
|
||||
The {@link api/ng.$compile `$compile` API} page has a comprehensive list of directive options for
|
||||
reference.
|
||||
|
||||
|
||||
@@ -88,7 +88,7 @@ In Angular applications, you move the job of filling page templates with data fr
|
||||
|
||||
* **Workflow:** [Yeoman.io](https://github.com/yeoman/generator-angular) and [Angular Yeoman Tutorial](http://www.sitepoint.com/kickstart-your-angularjs-development-with-yeoman-grunt-and-bower/)
|
||||
|
||||
## Complimentary Libraries
|
||||
## Complementary Libraries
|
||||
|
||||
This is a short list of libraries with specific support and documentation for working with Angular. You can find a full list of all known Angular external libraries at [ngmodules.org](http://ngmodules.org/).
|
||||
|
||||
@@ -134,6 +134,7 @@ This is a short list of libraries with specific support and documentation for wo
|
||||
* [AngularJS Directives](http://www.amazon.com/AngularJS-Directives-Alex-Vanston/dp/1783280336) by Alex Vanston
|
||||
* [Recipes With AngularJS](http://www.amazon.co.uk/Recipes-Angular-js-Frederik-Dietz-ebook/dp/B00DK95V48) by Frederik Dietz
|
||||
* [Developing an AngularJS Edge](http://www.amazon.com/Developing-AngularJS-Edge-Christopher-Hiller-ebook/dp/B00CJLFF8K) by Christopher Hiller
|
||||
* [ng-book: The Complete Book on AngularJS](http://ng-book.com/) by Ari Lerner
|
||||
|
||||
###Videos:
|
||||
* [egghead.io](http://egghead.io/),
|
||||
@@ -164,6 +165,8 @@ The recipe for getting help on your unique issue is to create an example that co
|
||||
|
||||
* **Daily updates:** [Google+](https://plus.google.com/u/0/+AngularJS) or [Twitter](https://twitter.com/angularjs)
|
||||
|
||||
* **Weekly newsletter:** [ng-newsletter](http://www.ng-newsletter.com/)
|
||||
|
||||
* **Meetups: **[meetup.com](http://www.meetup.com/find/?keywords=angularJS&radius=Infinity&userFreeform=San+Francisco%2C+CA&mcId=z94108&mcName=San+Francisco%2C+CA&sort=member_count&eventFilter=mysugg)
|
||||
|
||||
* **Official news and releases: **[AngularJS Blog](http://blog.angularjs.org/)
|
||||
|
||||
@@ -0,0 +1,651 @@
|
||||
@ngdoc overview
|
||||
@name Migrating from 1.0 to 1.2
|
||||
@description
|
||||
|
||||
|
||||
AngularJS version 1.2 introduces several breaking changes that will may require changes to your
|
||||
application's source code.
|
||||
|
||||
Although we try to avoid breaking changes, there are some cases where it is unavoidable.
|
||||
AngularJS 1.2 has undergone a thourough security review to make applications safer by default,
|
||||
which has driven many of these changes. Several new features, especially animations, would not
|
||||
be possible without a few changes. Finally, some outstanding bugs were best fixed by changing
|
||||
an existing API.
|
||||
|
||||
<div class="alert alert-warning">
|
||||
<p>**Note:** AngularJS versions 1.1.x are considered "experimental" with breaking changes between minor releases.
|
||||
Version 1.2 is the result of several versions on the 1.1 branch, and has a stable API.</p>
|
||||
|
||||
<p>If you have an application on 1.1 and want to migrate it to 1.2, everything in the guide
|
||||
below should still apply, but you may want to consult the
|
||||
[changelog](https://github.com/angular/angular.js/blob/master/CHANGELOG.md) as well.</p>
|
||||
</div>
|
||||
|
||||
<ul class="nav nav-list">
|
||||
<li class="nav-header">Summary of Breaking Changes</li>
|
||||
<li>{@link guide/migration#ngroute-has-been-moved-into-its-own-module ngRoute has been moved into its own module}</li>
|
||||
<li>{@link guide/migration#templates-no-longer-automatically-unwrap-promises Templates no longer automatically unwrap promises}</li>
|
||||
<li>{@link guide/migration#syntax-for-named-wildcard-parameters-changed-in Syntax for named wildcard parameters changed in <code>$route</code>}</li>
|
||||
<li>{@link guide/migration#you-can-only-bind-one-expression-to You can only bind one expression to <code>*[src]</code> or <code>*[ng-src]</code>}</li>
|
||||
<li>{@link guide/migration#interpolations-inside-dom-event-handlers-are-now-disallowed Interpolations inside DOM event handlers are now disallowed}</li>
|
||||
<li>{@link guide/migration#directives-cannot-end-with--start-or--end Directives cannot end with -start or -end}</li>
|
||||
<li>{@link guide/migration#in-$q,-promisealways-has-been-renamed-promisefinally In $q, promise.always has been renamed promise.finally}</li>
|
||||
<li>{@link guide/migration#ngmobile-is-now-ngtouch ngMobile is now ngTouch}</li>
|
||||
<li>{@link guide/migration#resource$then-has-been-removed resource.$then has been removed}</li>
|
||||
<li>{@link guide/migration#resource-methods-return-the-promise Resource methods return the promise}</li>
|
||||
<li>{@link guide/migration#resource-promises-are-resolved-with-the-resource-instance Resource promises are resolved with the resource instance}</li>
|
||||
<li>{@link guide/migration#$locationsearch-supports-multiple-keys $location.search supports multiple keys}</li>
|
||||
<li>{@link guide/migration#nghtmlbindunsafe-has-been-removed-and-replaced-by-nghtmlbind ngHtmlBindUnsafe has been removed and replaced by ngHtmlBind}</li>
|
||||
<li>{@link guide/migration#form-names-that-are-expressions-are-evaluated Form names that are expressions are evaluated}</li>
|
||||
<li>{@link guide/migration#hasownproperty-disallowed-as-an-input-name hasOwnProperty disallowed as an input name}</li>
|
||||
<li>{@link guide/migration#directives-order-of-postlink-functions-reversed Directives: Order of postLink functions reversed}</li>
|
||||
<li>{@link guide/migration#directive-priority Directive priority}</li>
|
||||
<li>{@link guide/migration#ngscenario ngScenario}</li>
|
||||
<li>{@link guide/migration#nginclude-and-ngview-replace-its-entire-element-on-update ngInclude and ngView replace its entire element on update}</li>
|
||||
<li>{@link guide/migration#urls-are-now-sanitized-against-a-whitelist URLs are now sanitized against a whitelist}</li>
|
||||
<li>{@link guide/migration#isolate-scope-only-exposed-to-directives-with-property Isolate scope only exposed to directives with <code>scope</code> property}</li>
|
||||
<li>{@link guide/migration#change-to-interpolation-priority Change to interpolation priority}</li>
|
||||
<li>{@link guide/migration#underscore-prefixed/suffixed-prorperties-are-non-bindable Underscore-prefixed/suffixed prorperties are non-bindable}</li>
|
||||
<li>{@link guide/migration#you-cannot-bind-to-select[multiple] You cannot bind to select[multiple]}</li>
|
||||
<li>{@link guide/migration#uncommon-region-specific-local-files-were-removed-from-i18n Uncommon region-specific local files were removed from i18n}</li>
|
||||
</ul>
|
||||
|
||||
|
||||
## ngRoute has been moved into its own module
|
||||
|
||||
Just like `ngResource`, `ngRoute` is now its own module.
|
||||
|
||||
Applications that use `$route`, `ngView`, and/or `$routeParams` will now need to load an
|
||||
`angular-route.js` file and have their application's module dependency on the `ngRoute` module.
|
||||
|
||||
Before:
|
||||
|
||||
```html
|
||||
<script src="angular.js"></script>
|
||||
```
|
||||
|
||||
```javascript
|
||||
var myApp = angular.module('myApp', ['someOtherModule']);
|
||||
```
|
||||
|
||||
After:
|
||||
|
||||
```html
|
||||
<script src="angular.js"></script>
|
||||
<script src="angular-route.js"></script>
|
||||
```
|
||||
|
||||
```javascript
|
||||
var myApp = angular.module('myApp', ['ngRoute', 'someOtherModule']);
|
||||
```
|
||||
|
||||
See [5599b55b](https://github.com/angular/angular.js/commit/5599b55b04788c2e327d7551a4a699d75516dd21).
|
||||
|
||||
|
||||
## Templates no longer automatically unwrap promises
|
||||
|
||||
`$parse` and templates in general will no longer automatically unwrap promises.
|
||||
|
||||
Before:
|
||||
|
||||
```javascript
|
||||
$scope.foo = $http({method: 'GET', url: '/someUrl'});
|
||||
```
|
||||
|
||||
```html
|
||||
<p>{{foo}}</p>
|
||||
```
|
||||
|
||||
After:
|
||||
|
||||
```javascript
|
||||
$http({method: 'GET', url: '/someUrl'})
|
||||
.success(function(data) {
|
||||
$scope.foo = data;
|
||||
});
|
||||
```
|
||||
|
||||
```html
|
||||
<p>{{foo}}</p>
|
||||
```
|
||||
|
||||
This feature has been deprecated. If absolutely needed, it can be reenabled for now via the
|
||||
`$parseProvider.unwrapPromises(true)` API.
|
||||
|
||||
See [5dc35b52](https://github.com/angular/angular.js/commit/5dc35b527b3c99f6544b8cb52e93c6510d3ac577),
|
||||
[b6a37d11](https://github.com/angular/angular.js/commit/b6a37d112b3e1478f4d14a5f82faabf700443748).
|
||||
|
||||
|
||||
## Syntax for named wildcard parameters changed in `$route`
|
||||
|
||||
To migrate the code, follow the example below. Here, `*highlight` becomes `:highlight*`
|
||||
|
||||
Before:
|
||||
|
||||
```javascript
|
||||
$routeProvider.when('/Book1/:book/Chapter/:chapter/*highlight/edit',
|
||||
{controller: noop, templateUrl: 'Chapter.html'});
|
||||
```
|
||||
|
||||
After:
|
||||
|
||||
```javascript
|
||||
$routeProvider.when('/Book1/:book/Chapter/:chapter/:highlight*/edit',
|
||||
{controller: noop, templateUrl: 'Chapter.html'});
|
||||
```
|
||||
|
||||
See [04cebcc1](https://github.com/angular/angular.js/commit/04cebcc133c8b433a3ac5f72ed19f3631778142b).
|
||||
|
||||
|
||||
## You can only bind one expression to `*[src]` or `*[ng-src]`
|
||||
|
||||
With the exception of `<a>` and `<img>` elements, you cannot bind more than one expression to the
|
||||
`src` attribute of elements.
|
||||
|
||||
This is one of several improvements to security introduces by Angular 1.2.
|
||||
|
||||
Concatenating expressions makes it hard to understand whether some combination of concatenated
|
||||
values are unsafe to use and potentially subject to XSS vulnerabilities. To simplify the task of
|
||||
auditing for XSS issues, we now require that a single expression be used for `*[src/ng-src]`
|
||||
bindings such as bindings for `iframe[src]`, `object[src]`, etc.
|
||||
|
||||
<table class="table table-bordered code-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Examples</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><code><img src="{{a}}/{{b}}"></code></td>
|
||||
<td class="success">ok</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code><iframe src="{{a}}/{{b}}"></iframe></code></td>
|
||||
<td class="error">bad</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code><iframe src="{{a}}"></iframe></code></td>
|
||||
<td class="success">ok</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
|
||||
To migrate your code, you can combine multiple expressions using a method attached to your scope.
|
||||
|
||||
Before:
|
||||
|
||||
```javascript
|
||||
scope.baseUrl = 'page';
|
||||
scope.a = 1;
|
||||
scope.b = 2;
|
||||
```
|
||||
|
||||
```html
|
||||
<!-- Are a and b properly escaped here? Is baseUrl controlled by user? -->
|
||||
<iframe src="{{baseUrl}}?a={{a}&b={{b}}">
|
||||
```
|
||||
|
||||
After:
|
||||
|
||||
```javascript
|
||||
var baseUrl = "page";
|
||||
scope.getIframeSrc = function() {
|
||||
|
||||
// One should think about their particular case and sanitize accordingly
|
||||
var qs = ["a", "b"].map(function(value, name) {
|
||||
return encodeURIComponent(name) + "=" +
|
||||
encodeURIComponent(value);
|
||||
}).join("&");
|
||||
|
||||
// `baseUrl` isn't exposed to a user's control, so we don't have to worry about escaping it.
|
||||
return baseUrl + "?" + qs;
|
||||
};
|
||||
```
|
||||
|
||||
```html
|
||||
<iframe src="{{getIframeSrc()}}">
|
||||
```
|
||||
|
||||
See [38deedd6](https://github.com/angular/angular.js/commit/38deedd6e3d806eb8262bb43f26d47245f6c2739).
|
||||
|
||||
|
||||
## Interpolations inside DOM event handlers are now disallowed
|
||||
|
||||
DOM event handlers execute arbitrary Javascript code. Using an interpolation for such handlers
|
||||
means that the interpolated value is a JS string that is evaluated. Storing or generating such
|
||||
strings is error prone and leads to XSS vulnerabilities. On the other hand, `ngClick` and other
|
||||
Angular specific event handlers evaluate Angular expressions in non-window (Scope) context which
|
||||
makes them much safer.
|
||||
|
||||
To migrate the code follow the example below:
|
||||
|
||||
Before:
|
||||
|
||||
```
|
||||
JS: scope.foo = 'alert(1)';
|
||||
HTML: <div onclick="{{foo}}">
|
||||
```
|
||||
|
||||
After:
|
||||
|
||||
```
|
||||
JS: scope.foo = function() { alert(1); }
|
||||
HTML: <div ng-click="foo()">
|
||||
```
|
||||
|
||||
See [39841f2e](https://github.com/angular/angular.js/commit/39841f2ec9b17b3b2920fd1eb548d444251f4f56).
|
||||
|
||||
|
||||
## Directives cannot end with -start or -end
|
||||
|
||||
This change was necessary to enable multi-element directives. The best fix is to rename existing
|
||||
directives so that they don't end with these suffixes.
|
||||
|
||||
See [e46100f7](https://github.com/angular/angular.js/commit/e46100f7097d9a8f174bdb9e15d4c6098395c3f2).
|
||||
|
||||
|
||||
## In $q, promise.always has been renamed promise.finally
|
||||
|
||||
The reason for this change is to align `$q` with the [Q promise
|
||||
library](https://github.com/kriskowal/q), despite the fact that this makes it a bit more difficult
|
||||
to use with non-ES5 browsers, like IE8.
|
||||
|
||||
`finally` also goes well together with the `catch` API that was added to `$q` recently and is part
|
||||
of the [DOM promises standard](http://dom.spec.whatwg.org/).
|
||||
|
||||
To migrate the code follow the example below.
|
||||
|
||||
Before:
|
||||
|
||||
```javascript
|
||||
$http.get('/foo').always(doSomething);
|
||||
```
|
||||
|
||||
After:
|
||||
|
||||
```javascript
|
||||
$http.get('/foo').finally(doSomething);
|
||||
```
|
||||
|
||||
Or for IE8-compatible code:
|
||||
|
||||
```javascript
|
||||
$http.get('/foo')['finally'](doSomething);
|
||||
```
|
||||
|
||||
See [f078762d](https://github.com/angular/angular.js/commit/f078762d48d0d5d9796dcdf2cb0241198677582c).
|
||||
|
||||
|
||||
## ngMobile is now ngTouch
|
||||
|
||||
Many touch-enabled devices are not mobile devices, so we decided to rename this module to better
|
||||
reflect its concerns.
|
||||
|
||||
To migrate, replace all references to `ngMobile` with `ngTouch` and `angular-mobile.js` with
|
||||
`angular-touch.js`.
|
||||
|
||||
See [94ec84e7](https://github.com/angular/angular.js/commit/94ec84e7b9c89358dc00e4039009af9e287bbd05).
|
||||
|
||||
|
||||
## resource.$then has been removed
|
||||
|
||||
Resource instances do not have a `$then` function anymore. Use the `$promise.then` instead.
|
||||
|
||||
Before:
|
||||
|
||||
```javascript
|
||||
Resource.query().$then(callback);
|
||||
```
|
||||
|
||||
After:
|
||||
|
||||
```javascript
|
||||
Resource.query().$promise.then(callback);
|
||||
```
|
||||
|
||||
See [05772e15](https://github.com/angular/angular.js/commit/05772e15fbecfdc63d4977e2e8839d8b95d6a92d).
|
||||
|
||||
|
||||
## Resource methods return the promise
|
||||
|
||||
Methods of a resource instance return the promise rather than the instance itself.
|
||||
|
||||
Before:
|
||||
|
||||
```javascript
|
||||
resource.$save().chaining = true;
|
||||
```
|
||||
|
||||
After:
|
||||
|
||||
```javascript
|
||||
resource.$save();
|
||||
resource.chaining = true;
|
||||
```
|
||||
|
||||
See [05772e15](https://github.com/angular/angular.js/commit/05772e15fbecfdc63d4977e2e8839d8b95d6a92d).
|
||||
|
||||
|
||||
## Resource promises are resolved with the resource instance
|
||||
|
||||
On success, the resource promise is resolved with the resource instance rather than HTTP response object.
|
||||
|
||||
Use interceptor API to access the HTTP response object.
|
||||
|
||||
Before:
|
||||
|
||||
```javascript
|
||||
Resource.query().$then(function(response) {...});
|
||||
```
|
||||
|
||||
After:
|
||||
|
||||
```javascript
|
||||
var Resource = $resource('/url', {}, {
|
||||
get: {
|
||||
method: 'get',
|
||||
interceptor: {
|
||||
response: function(response) {
|
||||
// expose response
|
||||
return response;
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
```
|
||||
|
||||
See [05772e15](https://github.com/angular/angular.js/commit/05772e15fbecfdc63d4977e2e8839d8b95d6a92d).
|
||||
|
||||
|
||||
## $location.search supports multiple keys
|
||||
|
||||
{@link api/ng.$location#methods_search `$location.search`} now supports multiple keys with the
|
||||
same value provided that the values are stored in an array.
|
||||
|
||||
Before this change:
|
||||
|
||||
* `parseKeyValue` only took the last key overwriting all the previous keys.
|
||||
* `toKeyValue` joined the keys together in a comma delimited string.
|
||||
|
||||
This was deemed buggy behavior. If your server relied on this behavior then either the server
|
||||
should be fixed, or a simple serialization of the array should be done on the client before
|
||||
passing it to `$location`.
|
||||
|
||||
See [80739409](https://github.com/angular/angular.js/commit/807394095b991357225a03d5fed81fea5c9a1abe).
|
||||
|
||||
|
||||
## ngHtmlBindUnsafe has been removed and replaced by ngHtmlBind
|
||||
|
||||
`ngHtmlBind` which has been moved from `ngSanitize` module to the core `ng` module.
|
||||
|
||||
`ngBindHtml` provides `ngHtmlBindUnsafe` like
|
||||
behavior (evaluate an expression and innerHTML the result into the DOM) when bound to the result
|
||||
of `$sce.trustAsHtml(string)`. When bound to a plain string, the string is sanitized via
|
||||
`$sanitize` before being innerHTML'd. If the `$sanitize` service isn't available (`ngSanitize`
|
||||
module is not loaded) and the bound expression evaluates to a value that is not trusted an
|
||||
exception is thrown.
|
||||
|
||||
See [dae69473](https://github.com/angular/angular.js/commit/dae694739b9581bea5dbc53522ec00d87b26ae55).
|
||||
|
||||
|
||||
## Form names that are expressions are evaluated
|
||||
|
||||
If you have form names that will evaluate as an expression:
|
||||
|
||||
```
|
||||
<form name="ctrl.form">
|
||||
```
|
||||
|
||||
And if you are accessing the form from your controller:
|
||||
|
||||
Before:
|
||||
|
||||
```javascript
|
||||
function($scope) {
|
||||
$scope['ctrl.form'] // form controller instance
|
||||
}
|
||||
```
|
||||
|
||||
After:
|
||||
|
||||
```javascript
|
||||
function($scope) {
|
||||
$scope.ctrl.form // form controller instance
|
||||
}
|
||||
```
|
||||
|
||||
This makes it possible to access a form from a controller using the new "controller as" syntax.
|
||||
Supporting the previous behavior offers no benefit.
|
||||
|
||||
See [8ea802a1](https://github.com/angular/angular.js/commit/8ea802a1d23ad8ecacab892a3a451a308d9c39d7).
|
||||
|
||||
|
||||
## hasOwnProperty disallowed as an input name
|
||||
|
||||
Inputs with name equal to `hasOwnProperty` are not allowed inside form or ngForm directives.
|
||||
|
||||
Before, inputs whose name was "hasOwnProperty" were quietly ignored and not added to the scope.
|
||||
Now a badname exception is thrown. Using "hasOwnProperty" for an input name would be very unusual
|
||||
and bad practice. To migrate, change your input name.
|
||||
|
||||
See [7a586e5c](https://github.com/angular/angular.js/commit/7a586e5c19f3d1ecc3fefef084ce992072ee7f60).
|
||||
|
||||
|
||||
## Directives: Order of postLink functions reversed
|
||||
|
||||
The order of postLink fn is now mirror opposite of the order in which corresponding preLinking and compile functions execute.
|
||||
|
||||
Previously the compile/link fns executed in order, sorted by priority:
|
||||
|
||||
<table class="table table-bordered table-striped code-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>#</th>
|
||||
<th>Step</th>
|
||||
<th align="center">Old Sort Order</th>
|
||||
<th align="center">New Sort Order</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td>Compile Fns</td>
|
||||
<td align="center" colspan="2">High → Low</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>2</td>
|
||||
<td colspan="3">Compile child nodes</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>3</td>
|
||||
<td>PreLink Fns</td>
|
||||
<td align="center" colspan="2">High → Low</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>4</td>
|
||||
<td colspan="3">Link child nodes</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>5</td>
|
||||
<td>PostLink Fns</td>
|
||||
<td align="center">High → Low</td>
|
||||
<td align="center">**Low → High**</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<small>"High → Low" here refers to the `priority` option of a directive.</small>
|
||||
|
||||
Very few directives in practice rely on the order of postLinking functions (unlike on the order
|
||||
of compile functions), so in the rare case of this change affecting an existing directive, it might
|
||||
be necessary to convert it to a preLinking function or give it negative priority.
|
||||
|
||||
You can look at [the diff of this
|
||||
commit](https://github.com/angular/angular.js/commit/31f190d4d53921d32253ba80d9ebe57d6c1de82b) to see how an internal
|
||||
attribute interpolation directive was adjusted.
|
||||
|
||||
See [31f190d4](https://github.com/angular/angular.js/commit/31f190d4d53921d32253ba80d9ebe57d6c1de82b).
|
||||
|
||||
|
||||
## Directive priority
|
||||
|
||||
the priority of ngRepeat, ngSwitchWhen, ngIf, ngInclude and ngView has changed. This could affect directives that explicitly specify their priority.
|
||||
|
||||
In order to make ngRepeat, ngSwitchWhen, ngIf, ngInclude and ngView work together in all common scenarios their directives are being adjusted to achieve the following precendence:
|
||||
|
||||
|
||||
Directive | Old Priority | New Priority
|
||||
-----------------|--------------|-------------
|
||||
ngRepeat | 1000 | 1000
|
||||
ngSwitchWhen | 500 | 800
|
||||
ngIf | 1000 | 600
|
||||
ngInclude | 1000 | 400
|
||||
ngView | 1000 | 400
|
||||
|
||||
See [b7af76b4](https://github.com/angular/angular.js/commit/b7af76b4c5aa77648cc1bfd49935b48583419023).
|
||||
|
||||
|
||||
## ngScenario
|
||||
|
||||
browserTrigger now uses an eventData object instead of direct parameters for mouse events.
|
||||
To migrate, place the `keys`,`x` and `y` parameters inside of an object and place that as the
|
||||
third parameter for the browserTrigger function.
|
||||
|
||||
See [28f56a38](https://github.com/angular/angular.js/commit/28f56a383e9d1ff378e3568a3039e941c7ffb1d8).
|
||||
|
||||
|
||||
## ngInclude and ngView replace its entire element on update
|
||||
|
||||
Previously `ngInclude` and `ngView` only updated its element's content. Now these directives will
|
||||
recreate the element every time a new content is included.
|
||||
|
||||
This ensures that a single rootElement for all the included contents always exists, which makes
|
||||
definition of css styles for animations much easier.
|
||||
|
||||
See [7d69d52a](https://github.com/angular/angular.js/commit/7d69d52acff8578e0f7d6fe57a6c45561a05b182),
|
||||
[aa2133ad](https://github.com/angular/angular.js/commit/aa2133ad818d2e5c27cbd3933061797096356c8a).
|
||||
|
||||
|
||||
## URLs are now sanitized against a whitelist
|
||||
|
||||
A whitelist configured via `$compileProvider` can be used to configure what URLs are considered safe.
|
||||
By default all common protocol prefixes are whitelisted including `data:` URIs with mime types `image/*`.
|
||||
This change sholdn't impact apps that don't contain malicious image links.
|
||||
|
||||
See [1adf29af](https://github.com/angular/angular.js/commit/1adf29af13890d61286840177607edd552a9df97),
|
||||
[3e39ac7e](https://github.com/angular/angular.js/commit/3e39ac7e1b10d4812a44dad2f959a93361cd823b).
|
||||
|
||||
|
||||
## Isolate scope only exposed to directives with `scope` property
|
||||
|
||||
Directives without isolate scope do not get the isolate scope from an isolate directive on the
|
||||
same element. If your code depends on this behavior (non-isolate directive needs to access state
|
||||
from within the isolate scope), change the isolate directive to use scope locals to pass these explicitly.
|
||||
|
||||
**Before**
|
||||
|
||||
```
|
||||
<input ng-model="$parent.value" ng-isolate>
|
||||
|
||||
.directive('ngIsolate', function() {
|
||||
return {
|
||||
scope: {},
|
||||
template: '{{value}}'
|
||||
};
|
||||
});
|
||||
```
|
||||
|
||||
**After**
|
||||
|
||||
```
|
||||
<input ng-model="value" ng-isolate>
|
||||
|
||||
.directive('ngIsolate', function() {
|
||||
return {
|
||||
scope: {value: '=ngModel'},
|
||||
template: '{{value}}
|
||||
};
|
||||
});
|
||||
```
|
||||
|
||||
See [909cabd3](https://github.com/angular/angular.js/commit/909cabd36d779598763cc358979ecd85bb40d4d7),
|
||||
[#1924](https://github.com/angular/angular.js/issues/1924) and
|
||||
[#2500](https://github.com/angular/angular.js/issues/2500).
|
||||
|
||||
|
||||
## Change to interpolation priority
|
||||
|
||||
Previously, the interpolation priority was `-100` in 1.2.0-rc.2, and `100` before 1.2.0-rc.2.
|
||||
Before this change the binding was setup in the post-linking phase.
|
||||
|
||||
Now the attribute interpolation (binding) executes as a directive with priority 100 and the
|
||||
binding is set up in the pre-linking phase.
|
||||
|
||||
See [79223eae](https://github.com/angular/angular.js/commit/79223eae5022838893342c42dacad5eca83fabe8),
|
||||
[#4525](https://github.com/angular/angular.js/issues/4525),
|
||||
[#4528](https://github.com/angular/angular.js/issues/4528), and
|
||||
[#4649](https://github.com/angular/angular.js/issues/4649)
|
||||
|
||||
## Underscore-prefixed/suffixed prorperties are non-bindable
|
||||
|
||||
This change introduces the notion of "private" properties (properties
|
||||
whose names begin and/or end with an underscore) on the scope chain.
|
||||
These properties will not be available to Angular expressions (i.e. {{
|
||||
}} interpolation in templates and strings passed to `$parse`) They are
|
||||
freely available to JavaScript code (as before).
|
||||
|
||||
**Motivation**
|
||||
|
||||
Angular expressions execute in a limited context. They do not have
|
||||
direct access to the global scope, `window`, `document` or the Function
|
||||
constructor. However, they have direct access to names/properties on
|
||||
the scope chain. It has been a long standing best practice to keep
|
||||
sensitive APIs outside of the scope chain (in a closure or your
|
||||
controller.) That's easier said that done for two reasons:
|
||||
|
||||
1. JavaScript does not have a notion of private properties so if you need
|
||||
someone on the scope chain for JavaScript use, you also expose it to
|
||||
Angular expressions
|
||||
2. The new `controller as` syntax that's now in increased usage exposes the
|
||||
entire controller on the scope chain greatly increaing the exposed surface.
|
||||
|
||||
Though Angular expressions are written and controlled by the developer, they:
|
||||
|
||||
1. Typically deal with user input
|
||||
2. Don't get the kind of test coverage that JavaScript code would
|
||||
|
||||
This commit provides a way, via a naming convention, to allow restricting properties from
|
||||
controllers/scopes. This means Angular expressions can access only those properties that
|
||||
are actually needed by the expressions.
|
||||
|
||||
See [3d6a89e8](https://github.com/angular/angular.js/commit/3d6a89e8888b14ae5cb5640464e12b7811853c7e).
|
||||
|
||||
|
||||
## You cannot bind to select[multiple]
|
||||
|
||||
Switching between `select[single]` and `select[multiple]` has always been odd due to browser quirks.
|
||||
This feature never worked with two-way data-binding so it's not expected that anyone is using it.
|
||||
|
||||
If you are interested in properly adding this feature, please submit a pull request on Github.
|
||||
|
||||
See [d87fa004](https://github.com/angular/angular.js/commit/d87fa0042375b025b98c40bff05e5f42c00af114).
|
||||
|
||||
|
||||
## Uncommon region-specific local files were removed from i18n
|
||||
|
||||
AngularJS uses the Google Closure library's locale files. The following locales were removed from
|
||||
Closure, so Angular is not able to continue to support them:
|
||||
|
||||
`chr`, `cy`, `el-polyton`, `en-zz`, `fr-rw`, `fr-sn`, `fr-td`, `fr-tg`, `haw`, `it-ch`, `ln-cg`,
|
||||
`mo`, `ms-bn`, `nl-aw`, `nl-be`, `pt-ao`, `pt-gw`, `pt-mz`, `pt-st`, `ro-md`, `ru-md`, `ru-ua`,
|
||||
`sr-cyrl-ba`, `sr-cyrl-me`, `sr-cyrl`, `sr-latn-ba`, `sr-latn-me`, `sr-latn`, `sr-rs`, `sv-fi`,
|
||||
`sw-ke`, `ta-lk`, `tl-ph`, `ur-in`, `zh-hans-hk`, `zh-hans-mo`, `zh-hans-sg`, `zh-hans`,
|
||||
`zh-hant-hk`, `zh-hant-mo`, `zh-hant-tw`, `zh-hant`
|
||||
|
||||
Although these locales were removed from the official AngularJS repository, you can continue to
|
||||
load and use your copy of the locale file provided that you maintain it yourself.
|
||||
|
||||
See [6382e21f](https://github.com/angular/angular.js/commit/6382e21fb28541a2484ac1a241d41cf9fbbe9d2c).
|
||||
|
||||
@@ -118,21 +118,23 @@ inheritance, and child scopes prototypically inherit from their parents.
|
||||
This example illustrates scopes in application, and prototypical inheritance of properties. The example is followed by
|
||||
a diagram depicting the scope boundaries.
|
||||
|
||||
<div class="show-scope">
|
||||
<example>
|
||||
<file name="index.html">
|
||||
<div class="show-scope-demo">
|
||||
<div ng-controller="GreetCtrl">
|
||||
Hello {{name}}!
|
||||
</div>
|
||||
<div ng-controller="ListCtrl">
|
||||
<ol>
|
||||
<li ng-repeat="name in names">{{name}}</li>
|
||||
<li ng-repeat="name in names">{{name}} from {{department}}</li>
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
</file>
|
||||
<file name="script.js">
|
||||
function GreetCtrl($scope) {
|
||||
function GreetCtrl($scope, $rootScope) {
|
||||
$scope.name = 'World';
|
||||
$rootScope.department = 'Angular';
|
||||
}
|
||||
|
||||
function ListCtrl($scope) {
|
||||
@@ -140,20 +142,19 @@ a diagram depicting the scope boundaries.
|
||||
}
|
||||
</file>
|
||||
<file name="style.css">
|
||||
.show-scope .doc-example-live.ng-scope,
|
||||
.show-scope .doc-example-live .ng-scope {
|
||||
.show-scope-demo.ng-scope,
|
||||
.show-scope-demo .ng-scope {
|
||||
border: 1px solid red;
|
||||
margin: 3px;
|
||||
}
|
||||
</file>
|
||||
</example>
|
||||
</div>
|
||||
|
||||
<img class="center" src="img/guide/concepts-scope.png">
|
||||
|
||||
Notice that Angular automatically places `ng-scope` class on elements where scopes are
|
||||
attached. The `<style>` definition in this example highlights in red the new scope locations. The
|
||||
child scopes are necessary because the repeater evaluates `{{employee.name}}` expression, but
|
||||
child scopes are necessary because the repeater evaluates `{{name}}` expression, but
|
||||
depending on which scope the expression is evaluated it produces different result. Similarly the
|
||||
evaluation of `{{department}}` prototypically inherits from root scope, as it is the only place
|
||||
where the `department` property is defined.
|
||||
|
||||
@@ -11,12 +11,12 @@ See the [contributing guidelines](https://github.com/angular/angular.js/blob/mas
|
||||
for how to contribute your own code to AngularJS.
|
||||
|
||||
|
||||
1. <a href="#developing-angularjs_installing-dependencies">Installing Dependencies</a>
|
||||
2. <a href="#developing-angularjs_forking-angular-on-github">Forking Angular on Github</a>
|
||||
3. <a href="#developing-angularjs_building-angularjs">Building AngularJS</a>
|
||||
4. <a href="#developing-angularjs_running-a-local-development-web-server">Running a Local Development Web Server</a>
|
||||
5. <a href="#developing-angularjs_running-the-unit-test-suite">Running the Unit Test Suite</a>
|
||||
6. <a href="#developing-angularjs_running-the-end-to-end-test-suite">Running the End-to-end Test Suite</a>
|
||||
1. {@link #building-and-testing-angularjs_installing-dependencies Installing Dependencies}
|
||||
2. {@link #building-and-testing-angularjs_forking-angular-on-github Forking Angular on Github}
|
||||
3. {@link #building-and-testing-angularjs_building-angularjs Building AngularJS}
|
||||
4. {@link #building-and-testing-angularjs_running-a-local-development-web-server Running a Local Development Web Server}
|
||||
5. {@link #building-and-testing-angularjs_running-the-unit-test-suite Running the Unit Test Suite}
|
||||
6. {@link #building-and-testing-angularjs_running-the-end-to-end-test-suite Running the End-to-end Test Suite}
|
||||
|
||||
## Installing Dependencies
|
||||
|
||||
@@ -81,8 +81,8 @@ grunt package
|
||||
|
||||
|
||||
<div class="alert alert-warning">
|
||||
**Note:** If you're using Windows you must run your command line with administrative privileges (right click, run as
|
||||
Administrator).
|
||||
**Note:** If you're using Windows, you must use an elevated command prompt (right click, run as
|
||||
Administrator). This is because `grunt package` creates some symbolic links.
|
||||
</div>
|
||||
|
||||
The build output can be located under the `build` directory. It consists of the following files and
|
||||
|
||||
@@ -9,20 +9,20 @@ This way, you don't have to download anything or maintain a local copy.
|
||||
There are two types of angular script URLs you can point to, one for development and one for
|
||||
production:
|
||||
|
||||
* __angular-<version>.js__ — This is the human-readable, non-minified version, suitable for web
|
||||
* __angular.js__ — This is the human-readable, non-minified version, suitable for web
|
||||
development.
|
||||
* __angular-<version>.min.js__ — This is the minified version, which we strongly suggest you use in
|
||||
* __angular.min.js__ — This is the minified version, which we strongly suggest you use in
|
||||
production.
|
||||
|
||||
To point your code to an angular script on the Google CDN server, use the following template. This
|
||||
example points to the minified version 1.0.2:
|
||||
example points to the minified version 1.2.0:
|
||||
|
||||
<pre>
|
||||
<!doctype html>
|
||||
<html ng-app>
|
||||
<head>
|
||||
<title>My Angular App</title>
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js"></script>
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0/angular.min.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
</body>
|
||||
@@ -58,7 +58,7 @@ for this angular version. Use this file to get everything in a single download.
|
||||
|
||||
* __`angular-mocks.js`__ — This file contains an implementation of mocks that makes
|
||||
testing angular apps even easier. Your unit/integration test harness should load this file after
|
||||
`angular-<version>.js` is loaded.
|
||||
`angular.js` is loaded.
|
||||
|
||||
* __`angular-scenario.js`__ — This file is a very nifty JavaScript file that allows you
|
||||
to write and execute end-to-end tests for angular applications.
|
||||
@@ -68,8 +68,19 @@ to write and execute end-to-end tests for angular applications.
|
||||
contents of this file are copy&pasted into the `index.html` to avoid even the initial request to `angular-loader.min.js`.
|
||||
See [angular-seed](https://github.com/angular/angular-seed/blob/master/app/index-async.html) for an example of usage.
|
||||
|
||||
* __`angular-resource.js`__, __`angular-cookies.js`__, etc - extra Angular modules with additional functionality.
|
||||
* __Additional Angular modules:__ optional modules with additional functionality. These files should be loaded
|
||||
after the core `angular.js` file:
|
||||
* __`angular-animate.js`__ - Enable animation support
|
||||
* __`angular-cookies.js`__ - A convenient wrapper for reading and writing browser cookies
|
||||
* __`angular-resource.js`__ - Interaction support with RESTful services via the $resource service
|
||||
* __`angular-route.js`__ - Routing and deeplinking services and directives for angular apps
|
||||
* __`angular-sanitize.js`__ - Functionality to sanitize HTML
|
||||
* __`angular-touch.js`__ - Touch events and other helpers for touch-enabled devices
|
||||
|
||||
|
||||
* __`docs`__ — this directory contains all the files that compose the
|
||||
<http://docs.angularjs.org/> documentation app. These files are handy to see the older version of
|
||||
our docs, or even more importantly, view the docs offline.
|
||||
|
||||
* __`i18n`__ - this directory contains locale specific `ngLocale` angular modules to override the defaults
|
||||
defined in the `ng` module.
|
||||
@@ -81,7 +81,7 @@ Yes, Angular can use {@link http://jquery.com/ jQuery} if it's present in your a
|
||||
application is being bootstrapped. If jQuery is not present in your script path, Angular falls back
|
||||
to its own implementation of the subset of jQuery that we call {@link api/angular.element jQLite}.
|
||||
|
||||
Due to a change to use `on()`/`off()` rather than `bind()`\`unbind()`, Angular 1.2 only operates with
|
||||
Due to a change to use `on()`/`off()` rather than `bind()`/`unbind()`, Angular 1.2 only operates with
|
||||
jQuery 1.7.1 or above.
|
||||
|
||||
|
||||
|
||||
@@ -66,7 +66,7 @@ directory.</p></li>
|
||||
<p>The tutorial instructions, from now on, assume you are running all commands from the <code>angular-phonecat</code>
|
||||
directory.</p></li>
|
||||
<li><p>You will also need Node.js and Karma to run unit tests, so please verify that you have
|
||||
<a href="http://nodejs.org/">Node.js</a> v0.8 or better installed
|
||||
<a href="http://nodejs.org/">Node.js</a> v0.10 or better installed
|
||||
and that the <code>node</code> executable is on your <code>PATH</code> by running the following
|
||||
command in a terminal window:</p></li>
|
||||
<pre>node --version</pre>
|
||||
|
||||
@@ -81,7 +81,7 @@ __`app/js/controllers.js`:__
|
||||
|
||||
var phonecatApp = angular.module('phonecatApp', []);
|
||||
|
||||
phonecatApp.controller('PhoneListCtrl', function PhoneListCtrl($scope) {
|
||||
phonecatApp.controller('PhoneListCtrl', function ($scope) {
|
||||
$scope.phones = [
|
||||
{'name': 'Nexus S',
|
||||
'snippet': 'Fast just got faster with Nexus S.'},
|
||||
@@ -104,7 +104,7 @@ the model and the view. We connected the dots between the presentation, data, an
|
||||
as follows:
|
||||
|
||||
* The {@link api/ng.directive:ngController ngController} directive, located on the `<body>` tag,
|
||||
references the the name of our controller, `PhoneListCtrl` (located in the JavaScript file
|
||||
references the name of our controller, `PhoneListCtrl` (located in the JavaScript file
|
||||
`controllers.js`).
|
||||
|
||||
* The `PhoneListCtrl` controller attaches the phone data to the `$scope` that was injected into our
|
||||
|
||||
@@ -67,7 +67,7 @@ __`app/js/controllers.js`:__
|
||||
<pre>
|
||||
var phonecatApp = angular.module('phonecatApp', []);
|
||||
|
||||
phonecatApp.controller('PhoneListCtrl', function PhoneListCtrl($scope) {
|
||||
phonecatApp.controller('PhoneListCtrl', function ($scope) {
|
||||
$scope.phones = [
|
||||
{'name': 'Nexus S',
|
||||
'snippet': 'Fast just got faster with Nexus S.',
|
||||
|
||||
@@ -56,7 +56,7 @@ __`app/js/controllers.js:`__
|
||||
<pre>
|
||||
var phonecatApp = angular.module('phonecatApp', []);
|
||||
|
||||
phonecatApp.controller('PhoneListCtrl', function PhoneListCtrl($scope, $http) {
|
||||
phonecatApp.controller('PhoneListCtrl', function ($scope, $http) {
|
||||
$http.get('phones/phones.json').success(function(data) {
|
||||
$scope.phones = data;
|
||||
});
|
||||
@@ -79,7 +79,7 @@ json response and parsed it for us!
|
||||
To use a service in angular, you simply declare the names of the dependencies you need as arguments
|
||||
to the controller's constructor function, as follows:
|
||||
|
||||
function PhoneListCtrl($scope, $http) {...}
|
||||
phonecatApp.controller('PhoneListCtrl', function ($scope, $http) {...}
|
||||
|
||||
Angular's dependency injector provides services to your controller when the controller is being
|
||||
constructed. The dependency injector also takes care of creating any transitive dependencies the
|
||||
@@ -145,7 +145,7 @@ __`app/js/controllers.js:`__
|
||||
var phonecatApp = angular.module('phonecatApp', []);
|
||||
|
||||
phonecatApp.controller('PhoneListCtrl', ['$scope', '$http',
|
||||
function PhoneListCtrl($scope, $http) {
|
||||
function ($scope, $http) {
|
||||
$http.get('phones/phones.json').success(function(data) {
|
||||
$scope.phones = data;
|
||||
});
|
||||
|
||||
@@ -149,7 +149,7 @@ __`app/js/controllers.js`:__
|
||||
var phonecatControllers = angular.module('phonecatControllers', []);
|
||||
|
||||
phonecatControllers.controller('PhoneListCtrl', ['$scope', '$http',
|
||||
function PhoneListCtrl($scope, $http) {
|
||||
function ($scope, $http) {
|
||||
$http.get('phones/phones.json').success(function(data) {
|
||||
$scope.phones = data;
|
||||
});
|
||||
|
||||
@@ -194,7 +194,7 @@ This time, instead of the `ng-repeat` element, let's add it to the element conta
|
||||
In order to do this, we'll have to make some small changes to the HTML code so that we can have more control over our
|
||||
animations between view changes.
|
||||
|
||||
__`app/partials/phone-list.html`.__
|
||||
__`app/index.html`.__
|
||||
<pre>
|
||||
<div class="view-container">
|
||||
<div ng-view class="view-frame"></div>
|
||||
|
||||
+27
-18
@@ -53,6 +53,7 @@ exports.ngVersions = function() {
|
||||
return expandVersions(sortVersionsNatrually(versions), exports.ngCurrentVersion().full);
|
||||
|
||||
function expandVersions(versions, latestVersion) {
|
||||
var RC_VERSION = /rc\d/;
|
||||
//copy the array to avoid changing the versions param data
|
||||
//the latest version is not on the git tags list, but
|
||||
//docs.angularjs.org will always point to master as of 1.2
|
||||
@@ -63,20 +64,10 @@ exports.ngVersions = function() {
|
||||
var version = versions[i],
|
||||
split = version.split('.'),
|
||||
isMaster = version == latestVersion,
|
||||
isStable = split[1] % 2 == 0;
|
||||
isStable = split[1] % 2 === 0 && !RC_VERSION.test(version);
|
||||
|
||||
var title = 'AngularJS - v' + version;
|
||||
|
||||
//anything that is stable before being unstable is a rc1 version
|
||||
//just like with AngularJS 1.2.0rc1 (even though it's apart of the
|
||||
//1.1.5 API
|
||||
if(isMaster || (isStable && !firstUnstable)) {
|
||||
isStable = false;
|
||||
}
|
||||
else {
|
||||
firstUnstable = firstUnstable || version;
|
||||
}
|
||||
|
||||
var docsPath = version < '1.0.2' ? 'docs-' + version : 'docs';
|
||||
|
||||
var url = isMaster ?
|
||||
@@ -556,10 +547,22 @@ Doc.prototype = {
|
||||
self = this,
|
||||
minerrMsg;
|
||||
|
||||
var gitTagFromFullVersion = function(version) {
|
||||
var match = version.match(/-(\w{7})/);
|
||||
|
||||
if (match) {
|
||||
// git sha
|
||||
return match[1];
|
||||
}
|
||||
|
||||
// git tag
|
||||
return 'v' + version;
|
||||
};
|
||||
|
||||
if (this.section === 'api') {
|
||||
dom.tag('a', {
|
||||
href: 'http://github.com/angular/angular.js/tree/v' +
|
||||
gruntUtil.getVersion().cdn + '/' + self.file + '#L' + self.line,
|
||||
href: 'http://github.com/angular/angular.js/tree/' +
|
||||
gitTagFromFullVersion(gruntUtil.getVersion().full) + '/' + self.file + '#L' + self.line,
|
||||
class: 'view-source btn btn-action' }, function(dom) {
|
||||
dom.tag('i', {class:'icon-zoom-in'}, ' ');
|
||||
dom.text(' View source');
|
||||
@@ -1108,7 +1111,7 @@ function scenarios(docs){
|
||||
function metadata(docs){
|
||||
var pages = [];
|
||||
docs.forEach(function(doc){
|
||||
var path = (doc.name || '').split(/(\.|\:\s*)/);
|
||||
var path = (doc.name || '').split(/(\:\s*)/);
|
||||
for ( var i = 1; i < path.length; i++) {
|
||||
path.splice(i, 1);
|
||||
}
|
||||
@@ -1383,10 +1386,16 @@ function explainModuleInstallation(moduleName){
|
||||
' <script src="angular.js">\n' +
|
||||
' <script src="' + modulePackageFile + '"></pre></code>' +
|
||||
|
||||
'<p>You can also find this file on the [Google CDN](https://developers.google.com/speed/libraries/devguide#angularjs), ' +
|
||||
'<a href="http://bower.io/">Bower</a> (as <code>' + modulePackage + '</code>), ' +
|
||||
'and on <a href="http://code.angularjs.org/">code.angularjs.org</a>.</p>' +
|
||||
|
||||
'<p>You can download this file from the following places:</p>' +
|
||||
'<ul>' +
|
||||
'<li>[Google CDN](https://developers.google.com/speed/libraries/devguide#angularjs)<br>' +
|
||||
'e.g. <code>"//ajax.googleapis.com/ajax/libs/angularjs/X.Y.Z/' + modulePackageFile + '"</code></li>' +
|
||||
'<li>[Bower](http://bower.io)<br>' +
|
||||
'e.g. <code>bower install ' + modulePackage + '@X.Y.Z</code></li>' +
|
||||
'<li><a href="http://code.angularjs.org/">code.angularjs.org</a><br>' +
|
||||
'e.g. <code>"//code.angularjs.org/X.Y.Z/' + modulePackageFile + '"</code></li>' +
|
||||
'</ul>' +
|
||||
'<p>where X.Y.Z is the AngularJS version you are running.</p>' +
|
||||
'<p>Then load the module in your application by adding it as a dependent module:</p><pre><code>' +
|
||||
' angular.module(\'app\', [\'' + ngMod + '\']);</pre></code>' +
|
||||
|
||||
|
||||
+2
-2
@@ -112,7 +112,7 @@ module.exports = {
|
||||
var processed = src
|
||||
.replace(/"NG_VERSION_FULL"/g, NG_VERSION.full)
|
||||
.replace(/"NG_VERSION_MAJOR"/, NG_VERSION.major)
|
||||
.replace(/"NG_VERSION_ MINOR"/, NG_VERSION.minor)
|
||||
.replace(/"NG_VERSION_MINOR"/, NG_VERSION.minor)
|
||||
.replace(/"NG_VERSION_DOT"/, NG_VERSION.dot)
|
||||
.replace(/"NG_VERSION_CDN"/, NG_VERSION.cdn)
|
||||
.replace(/"NG_VERSION_CODENAME"/, NG_VERSION.codename);
|
||||
@@ -168,7 +168,7 @@ module.exports = {
|
||||
var mapFile = minFile + '.map';
|
||||
var mapFileName = mapFile.match(/[^\/]+$/)[0];
|
||||
var errorFileName = file.replace(/\.js$/, '-errors.json');
|
||||
var versionNumber = this.getVersion().number;
|
||||
var versionNumber = this.getVersion().full;
|
||||
shell.exec(
|
||||
'java ' +
|
||||
this.java32flags() + ' ' +
|
||||
|
||||
+4
-4
@@ -1,8 +1,8 @@
|
||||
{
|
||||
"name": "angularjs",
|
||||
"version": "1.2.0",
|
||||
"cdnVersion": "1.2.0-rc.3",
|
||||
"codename": "timely-delivery",
|
||||
"version": "1.2.1",
|
||||
"cdnVersion": "1.2.0",
|
||||
"codename": "underscore-empathy",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/angular/angular.js.git"
|
||||
@@ -28,7 +28,7 @@
|
||||
"karma-sauce-launcher": "~0.1.1",
|
||||
"karma-script-launcher": "~0.1.0",
|
||||
"yaml-js": "~0.0.8",
|
||||
"marked": "~0.2.9",
|
||||
"marked": "0.2.9",
|
||||
"rewire": "1.1.3",
|
||||
"grunt-jasmine-node": "~0.1.0",
|
||||
"grunt-parallel": "~0.3.1",
|
||||
|
||||
@@ -11,6 +11,7 @@
|
||||
function setupModuleLoader(window) {
|
||||
|
||||
var $injectorMinErr = minErr('$injector');
|
||||
var ngMinErr = minErr('ng');
|
||||
|
||||
function ensure(obj, name, factory) {
|
||||
return obj[name] || (obj[name] = factory());
|
||||
@@ -71,6 +72,12 @@ function setupModuleLoader(window) {
|
||||
* @returns {module} new module with the {@link angular.Module} api.
|
||||
*/
|
||||
return function module(name, requires, configFn) {
|
||||
var assertNotHasOwnProperty = function(name, context) {
|
||||
if (name === 'hasOwnProperty') {
|
||||
throw ngMinErr('badname', 'hasOwnProperty is not a valid {0} name', context);
|
||||
}
|
||||
};
|
||||
|
||||
assertNotHasOwnProperty(name, 'module');
|
||||
if (requires && modules.hasOwnProperty(name)) {
|
||||
modules[name] = null;
|
||||
|
||||
+1
-1
@@ -4,4 +4,4 @@
|
||||
* License: MIT
|
||||
*/
|
||||
'use strict';
|
||||
(
|
||||
(function() {
|
||||
|
||||
+2
-1
@@ -1,4 +1,5 @@
|
||||
)(window);
|
||||
setupModuleLoader(window);
|
||||
})(window);
|
||||
|
||||
/**
|
||||
* Closure compiler type information
|
||||
|
||||
+7
-7
@@ -35,11 +35,11 @@ function minErr(module) {
|
||||
template = arguments[1],
|
||||
templateArgs = arguments,
|
||||
stringify = function (obj) {
|
||||
if (isFunction(obj)) {
|
||||
if (typeof obj === 'function') {
|
||||
return obj.toString().replace(/ \{[\s\S]*$/, '');
|
||||
} else if (isUndefined(obj)) {
|
||||
} else if (typeof obj === 'undefined') {
|
||||
return 'undefined';
|
||||
} else if (!isString(obj)) {
|
||||
} else if (typeof obj !== 'string') {
|
||||
return JSON.stringify(obj);
|
||||
}
|
||||
return obj;
|
||||
@@ -51,11 +51,11 @@ function minErr(module) {
|
||||
|
||||
if (index + 2 < templateArgs.length) {
|
||||
arg = templateArgs[index + 2];
|
||||
if (isFunction(arg)) {
|
||||
if (typeof arg === 'function') {
|
||||
return arg.toString().replace(/ ?\{[\s\S]*$/, '');
|
||||
} else if (isUndefined(arg)) {
|
||||
} else if (typeof arg === 'undefined') {
|
||||
return 'undefined';
|
||||
} else if (!isString(arg)) {
|
||||
} else if (typeof arg !== 'string') {
|
||||
return toJson(arg);
|
||||
}
|
||||
return arg;
|
||||
@@ -63,7 +63,7 @@ function minErr(module) {
|
||||
return match;
|
||||
});
|
||||
|
||||
message = message + '\nhttp://errors.angularjs.org/' + version.full + '/' +
|
||||
message = message + '\nhttp://errors.angularjs.org/"NG_VERSION_FULL"/' +
|
||||
(module ? module + '/' : '') + code;
|
||||
for (i = 2; i < arguments.length; i++) {
|
||||
message = message + (i == 2 ? '?' : '&') + 'p' + (i-2) + '=' +
|
||||
|
||||
+103
-52
@@ -115,8 +115,9 @@
|
||||
* When there are multiple directives defined on a single DOM element, sometimes it
|
||||
* is necessary to specify the order in which the directives are applied. The `priority` is used
|
||||
* to sort the directives before their `compile` functions get called. Priority is defined as a
|
||||
* number. Directives with greater numerical `priority` are compiled first. The order of directives with
|
||||
* the same priority is undefined. The default priority is `0`.
|
||||
* number. Directives with greater numerical `priority` are compiled first. Pre-link functions
|
||||
* are also run in priority order, but post-link functions are run in reverse order. The order
|
||||
* of directives with the same priority is undefined. The default priority is `0`.
|
||||
*
|
||||
* #### `terminal`
|
||||
* If set to true then the current `priority` will be the last set of directives
|
||||
@@ -177,8 +178,9 @@
|
||||
* * `$scope` - Current scope associated with the element
|
||||
* * `$element` - Current element
|
||||
* * `$attrs` - Current attributes object for the element
|
||||
* * `$transclude` - A transclude linking function pre-bound to the correct transclusion scope:
|
||||
* `function(cloneLinkingFn)`.
|
||||
* * `$transclude` - A transclude linking function pre-bound to the correct transclusion scope.
|
||||
* The scope can be overridden by an optional first argument.
|
||||
* `function([scope], cloneLinkingFn)`.
|
||||
*
|
||||
*
|
||||
* #### `require`
|
||||
@@ -271,7 +273,7 @@
|
||||
* * `tAttrs` - template attributes - Normalized list of attributes declared on this element shared
|
||||
* between all directive compile functions.
|
||||
*
|
||||
* * `transclude` - A transclude linking function: `function(scope, cloneLinkingFn)`.
|
||||
* * `transclude` - [*DEPRECATED*!] A transclude linking function: `function(scope, cloneLinkingFn)`
|
||||
*
|
||||
* <div class="alert alert-warning">
|
||||
* **Note:** The template instance and the link instance may be different objects if the template has
|
||||
@@ -280,6 +282,12 @@
|
||||
* should be done in a linking function rather than in a compile function.
|
||||
* </div>
|
||||
*
|
||||
* <div class="alert alert-error">
|
||||
* **Note:** The `transclude` function that is passed to the compile function is deperecated, as it
|
||||
* e.g. does not know about the right outer scope. Please use the transclude function that is passed
|
||||
* to the link function instead.
|
||||
* </div>
|
||||
|
||||
* A compile function can have a return value which can be either a function or an object.
|
||||
*
|
||||
* * returning a (post-link) function - is equivalent to registering the linking function via the
|
||||
@@ -294,7 +302,7 @@
|
||||
* This property is used only if the `compile` property is not defined.
|
||||
*
|
||||
* <pre>
|
||||
* function link(scope, iElement, iAttrs, controller) { ... }
|
||||
* function link(scope, iElement, iAttrs, controller, transcludeFn) { ... }
|
||||
* </pre>
|
||||
*
|
||||
* The link function is responsible for registering DOM listeners as well as updating the DOM. It is
|
||||
@@ -315,6 +323,10 @@
|
||||
* element defines a controller. The controller is shared among all the directives, which allows
|
||||
* the directives to use the controllers as a communication channel.
|
||||
*
|
||||
* * `transcludeFn` - A transclude linking function pre-bound to the correct transclusion scope.
|
||||
* The scope can be overridden by an optional first argument. This is the same as the `$transclude`
|
||||
* parameter of directive controllers.
|
||||
* `function([scope], cloneLinkingFn)`.
|
||||
*
|
||||
*
|
||||
* #### Pre-linking function
|
||||
@@ -820,7 +832,7 @@ function $CompileProvider($provide) {
|
||||
var compositeLinkFn =
|
||||
compileNodes($compileNodes, transcludeFn, $compileNodes,
|
||||
maxPriority, ignoreDirective, previousCompileContext);
|
||||
return function publicLinkFn(scope, cloneConnectFn){
|
||||
return function publicLinkFn(scope, cloneConnectFn, transcludeControllers){
|
||||
assertArg(scope, 'scope');
|
||||
// important!!: we must call our jqLite.clone() since the jQuery one is trying to be smart
|
||||
// and sometimes changes the structure of the DOM.
|
||||
@@ -828,6 +840,10 @@ function $CompileProvider($provide) {
|
||||
? JQLitePrototype.clone.call($compileNodes) // IMPORTANT!!!
|
||||
: $compileNodes;
|
||||
|
||||
forEach(transcludeControllers, function(instance, name) {
|
||||
$linkNode.data('$' + name + 'Controller', instance);
|
||||
});
|
||||
|
||||
// Attach scope only to non-text nodes.
|
||||
for(var i = 0, ii = $linkNode.length; i<ii; i++) {
|
||||
var node = $linkNode[i];
|
||||
@@ -926,15 +942,7 @@ function $CompileProvider($provide) {
|
||||
childTranscludeFn = nodeLinkFn.transclude;
|
||||
if (childTranscludeFn || (!boundTranscludeFn && transcludeFn)) {
|
||||
nodeLinkFn(childLinkFn, childScope, node, $rootElement,
|
||||
(function(transcludeFn) {
|
||||
return function(cloneFn) {
|
||||
var transcludeScope = scope.$new();
|
||||
transcludeScope.$$transcluded = true;
|
||||
|
||||
return transcludeFn(transcludeScope, cloneFn).
|
||||
on('$destroy', bind(transcludeScope, transcludeScope.$destroy));
|
||||
};
|
||||
})(childTranscludeFn || transcludeFn)
|
||||
createBoundTranscludeFn(scope, childTranscludeFn || transcludeFn)
|
||||
);
|
||||
} else {
|
||||
nodeLinkFn(childLinkFn, childScope, node, undefined, boundTranscludeFn);
|
||||
@@ -946,6 +954,23 @@ function $CompileProvider($provide) {
|
||||
}
|
||||
}
|
||||
|
||||
function createBoundTranscludeFn(scope, transcludeFn) {
|
||||
return function boundTranscludeFn(transcludedScope, cloneFn, controllers) {
|
||||
var scopeCreated = false;
|
||||
|
||||
if (!transcludedScope) {
|
||||
transcludedScope = scope.$new();
|
||||
transcludedScope.$$transcluded = true;
|
||||
scopeCreated = true;
|
||||
}
|
||||
|
||||
var clone = transcludeFn(transcludedScope, cloneFn, controllers);
|
||||
if (scopeCreated) {
|
||||
clone.on('$destroy', bind(transcludedScope, transcludedScope.$destroy));
|
||||
}
|
||||
return clone;
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Looks for directives on the given node and adds them to the directive collection which is
|
||||
@@ -1083,9 +1108,9 @@ function $CompileProvider($provide) {
|
||||
* @returns {Function}
|
||||
*/
|
||||
function groupElementsLinkFnWrapper(linkFn, attrStart, attrEnd) {
|
||||
return function(scope, element, attrs, controllers) {
|
||||
return function(scope, element, attrs, controllers, transcludeFn) {
|
||||
element = groupScan(element[0], attrStart, attrEnd);
|
||||
return linkFn(scope, element, attrs, controllers);
|
||||
return linkFn(scope, element, attrs, controllers, transcludeFn);
|
||||
};
|
||||
}
|
||||
|
||||
@@ -1122,7 +1147,9 @@ function $CompileProvider($provide) {
|
||||
controllerDirectives = previousCompileContext.controllerDirectives,
|
||||
newIsolateScopeDirective = previousCompileContext.newIsolateScopeDirective,
|
||||
templateDirective = previousCompileContext.templateDirective,
|
||||
transcludeDirective = previousCompileContext.transcludeDirective,
|
||||
nonTlbTranscludeDirective = previousCompileContext.nonTlbTranscludeDirective,
|
||||
hasTranscludeDirective = false,
|
||||
hasElementTranscludeDirective = false,
|
||||
$compileNode = templateAttrs.$$element = jqLite(compileNode),
|
||||
directive,
|
||||
directiveName,
|
||||
@@ -1173,15 +1200,18 @@ function $CompileProvider($provide) {
|
||||
}
|
||||
|
||||
if (directiveValue = directive.transclude) {
|
||||
hasTranscludeDirective = true;
|
||||
|
||||
// Special case ngIf and ngRepeat so that we don't complain about duplicate transclusion.
|
||||
// This option should only be used by directives that know how to how to safely handle element transclusion,
|
||||
// where the transcluded nodes are added or replaced after linking.
|
||||
if (!directive.$$tlb) {
|
||||
assertNoDuplicate('transclusion', transcludeDirective, directive, $compileNode);
|
||||
transcludeDirective = directive;
|
||||
assertNoDuplicate('transclusion', nonTlbTranscludeDirective, directive, $compileNode);
|
||||
nonTlbTranscludeDirective = directive;
|
||||
}
|
||||
|
||||
if (directiveValue == 'element') {
|
||||
hasElementTranscludeDirective = true;
|
||||
terminalPriority = directive.priority;
|
||||
$template = groupScan(compileNode, attrStart, attrEnd);
|
||||
$compileNode = templateAttrs.$$element =
|
||||
@@ -1197,9 +1227,9 @@ function $CompileProvider($provide) {
|
||||
// - newIsolateScopeDirective or templateDirective - combining templates with
|
||||
// element transclusion doesn't make sense.
|
||||
//
|
||||
// We need only transcludeDirective so that we prevent putting transclusion
|
||||
// We need only nonTlbTranscludeDirective so that we prevent putting transclusion
|
||||
// on the same element more than once.
|
||||
transcludeDirective: transcludeDirective
|
||||
nonTlbTranscludeDirective: nonTlbTranscludeDirective
|
||||
});
|
||||
} else {
|
||||
$template = jqLite(jqLiteClone(compileNode)).contents();
|
||||
@@ -1268,7 +1298,7 @@ function $CompileProvider($provide) {
|
||||
controllerDirectives: controllerDirectives,
|
||||
newIsolateScopeDirective: newIsolateScopeDirective,
|
||||
templateDirective: templateDirective,
|
||||
transcludeDirective: transcludeDirective
|
||||
nonTlbTranscludeDirective: nonTlbTranscludeDirective
|
||||
});
|
||||
ii = directives.length;
|
||||
} else if (directive.compile) {
|
||||
@@ -1292,7 +1322,7 @@ function $CompileProvider($provide) {
|
||||
}
|
||||
|
||||
nodeLinkFn.scope = newScopeDirective && newScopeDirective.scope === true;
|
||||
nodeLinkFn.transclude = transcludeDirective && childTranscludeFn;
|
||||
nodeLinkFn.transclude = hasTranscludeDirective && childTranscludeFn;
|
||||
|
||||
// might be normal or delayed nodeLinkFn depending on if templateUrl is present
|
||||
return nodeLinkFn;
|
||||
@@ -1319,7 +1349,7 @@ function $CompileProvider($provide) {
|
||||
}
|
||||
|
||||
|
||||
function getControllers(require, $element) {
|
||||
function getControllers(require, $element, elementControllers) {
|
||||
var value, retrievalMethod = 'data', optional = false;
|
||||
if (isString(require)) {
|
||||
while((value = require.charAt(0)) == '^' || value == '?') {
|
||||
@@ -1329,13 +1359,12 @@ function $CompileProvider($provide) {
|
||||
}
|
||||
optional = optional || value == '?';
|
||||
}
|
||||
value = null;
|
||||
|
||||
value = $element[retrievalMethod]('$' + require + 'Controller');
|
||||
|
||||
if ($element[0].nodeType == 8 && $element[0].$$controller) { // Transclusion comment node
|
||||
value = value || $element[0].$$controller;
|
||||
$element[0].$$controller = null;
|
||||
if (elementControllers && retrievalMethod === 'data') {
|
||||
value = elementControllers[require];
|
||||
}
|
||||
value = value || $element[retrievalMethod]('$' + require + 'Controller');
|
||||
|
||||
if (!value && !optional) {
|
||||
throw $compileMinErr('ctreq',
|
||||
@@ -1346,7 +1375,7 @@ function $CompileProvider($provide) {
|
||||
} else if (isArray(require)) {
|
||||
value = [];
|
||||
forEach(require, function(require) {
|
||||
value.push(getControllers(require, $element));
|
||||
value.push(getControllers(require, $element, elementControllers));
|
||||
});
|
||||
}
|
||||
return value;
|
||||
@@ -1354,7 +1383,7 @@ function $CompileProvider($provide) {
|
||||
|
||||
|
||||
function nodeLinkFn(childLinkFn, scope, linkNode, $rootElement, boundTranscludeFn) {
|
||||
var attrs, $element, i, ii, linkFn, controller, isolateScope;
|
||||
var attrs, $element, i, ii, linkFn, controller, isolateScope, elementControllers = {}, transcludeFn;
|
||||
|
||||
if (compileNode === linkNode) {
|
||||
attrs = templateAttrs;
|
||||
@@ -1448,14 +1477,14 @@ function $CompileProvider($provide) {
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
transcludeFn = boundTranscludeFn && controllersBoundTransclude;
|
||||
if (controllerDirectives) {
|
||||
forEach(controllerDirectives, function(directive) {
|
||||
var locals = {
|
||||
$scope: directive === newIsolateScopeDirective || directive.$$isolateScope ? isolateScope : scope,
|
||||
$element: $element,
|
||||
$attrs: attrs,
|
||||
$transclude: boundTranscludeFn
|
||||
$transclude: transcludeFn
|
||||
}, controllerInstance;
|
||||
|
||||
controller = directive.controller;
|
||||
@@ -1464,16 +1493,16 @@ function $CompileProvider($provide) {
|
||||
}
|
||||
|
||||
controllerInstance = $controller(controller, locals);
|
||||
|
||||
// Directives with element transclusion and a controller need to attach controller
|
||||
// to the comment node created by the compiler, but jQuery .data doesn't support
|
||||
// attaching data to comment nodes so instead we set it directly on the element and
|
||||
// remove it after we read it later.
|
||||
if ($element[0].nodeType == 8) { // Transclusion comment node
|
||||
$element[0].$$controller = controllerInstance;
|
||||
} else {
|
||||
// For directives with element transclusion the element is a comment,
|
||||
// but jQuery .data doesn't support attaching data to comment nodes as it's hard to
|
||||
// clean up (http://bugs.jquery.com/ticket/8335).
|
||||
// Instead, we save the controllers for the element in a local hash and attach to .data
|
||||
// later, once we have the actual element.
|
||||
elementControllers[directive.name] = controllerInstance;
|
||||
if (!hasElementTranscludeDirective) {
|
||||
$element.data('$' + directive.name + 'Controller', controllerInstance);
|
||||
}
|
||||
|
||||
if (directive.controllerAs) {
|
||||
locals.$scope[directive.controllerAs] = controllerInstance;
|
||||
}
|
||||
@@ -1485,7 +1514,7 @@ function $CompileProvider($provide) {
|
||||
try {
|
||||
linkFn = preLinkFns[i];
|
||||
linkFn(linkFn.isolateScope ? isolateScope : scope, $element, attrs,
|
||||
linkFn.require && getControllers(linkFn.require, $element));
|
||||
linkFn.require && getControllers(linkFn.require, $element, elementControllers), transcludeFn);
|
||||
} catch (e) {
|
||||
$exceptionHandler(e, startingTag($element));
|
||||
}
|
||||
@@ -1505,11 +1534,28 @@ function $CompileProvider($provide) {
|
||||
try {
|
||||
linkFn = postLinkFns[i];
|
||||
linkFn(linkFn.isolateScope ? isolateScope : scope, $element, attrs,
|
||||
linkFn.require && getControllers(linkFn.require, $element));
|
||||
linkFn.require && getControllers(linkFn.require, $element, elementControllers), transcludeFn);
|
||||
} catch (e) {
|
||||
$exceptionHandler(e, startingTag($element));
|
||||
}
|
||||
}
|
||||
|
||||
// This is the function that is injected as `$transclude`.
|
||||
function controllersBoundTransclude(scope, cloneAttachFn) {
|
||||
var transcludeControllers;
|
||||
|
||||
// no scope passed
|
||||
if (arguments.length < 2) {
|
||||
cloneAttachFn = scope;
|
||||
scope = undefined;
|
||||
}
|
||||
|
||||
if (hasElementTranscludeDirective) {
|
||||
transcludeControllers = elementControllers;
|
||||
}
|
||||
|
||||
return boundTranscludeFn(scope, cloneAttachFn, transcludeControllers);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1588,6 +1634,7 @@ function $CompileProvider($provide) {
|
||||
dst['class'] = (dst['class'] ? dst['class'] + ' ' : '') + value;
|
||||
} else if (key == 'style') {
|
||||
$element.attr('style', $element.attr('style') + ';' + value);
|
||||
dst['style'] = (dst['style'] ? dst['style'] + ';' : '') + value;
|
||||
// `dst` will never contain hasOwnProperty as DOM parser won't let it.
|
||||
// You will get an "InvalidCharacterError: DOM Exception 5" error if you
|
||||
// have an attribute like "has-own-property" or "data-has-own-property", etc.
|
||||
@@ -1618,7 +1665,7 @@ function $CompileProvider($provide) {
|
||||
|
||||
$http.get($sce.getTrustedResourceUrl(templateUrl), {cache: $templateCache}).
|
||||
success(function(content) {
|
||||
var compileNode, tempTemplateAttrs, $template;
|
||||
var compileNode, tempTemplateAttrs, $template, childBoundTranscludeFn;
|
||||
|
||||
content = denormalizeTemplate(content);
|
||||
|
||||
@@ -1663,7 +1710,7 @@ function $CompileProvider($provide) {
|
||||
var scope = linkQueue.shift(),
|
||||
beforeTemplateLinkNode = linkQueue.shift(),
|
||||
linkRootElement = linkQueue.shift(),
|
||||
controller = linkQueue.shift(),
|
||||
boundTranscludeFn = linkQueue.shift(),
|
||||
linkNode = $compileNode[0];
|
||||
|
||||
if (beforeTemplateLinkNode !== beforeTemplateCompileNode) {
|
||||
@@ -1671,9 +1718,13 @@ function $CompileProvider($provide) {
|
||||
linkNode = jqLiteClone(compileNode);
|
||||
replaceWith(linkRootElement, jqLite(beforeTemplateLinkNode), linkNode);
|
||||
}
|
||||
|
||||
if (afterTemplateNodeLinkFn.transclude) {
|
||||
childBoundTranscludeFn = createBoundTranscludeFn(scope, afterTemplateNodeLinkFn.transclude);
|
||||
} else {
|
||||
childBoundTranscludeFn = boundTranscludeFn;
|
||||
}
|
||||
afterTemplateNodeLinkFn(afterTemplateChildLinkFn, scope, linkNode, $rootElement,
|
||||
controller);
|
||||
childBoundTranscludeFn);
|
||||
}
|
||||
linkQueue = null;
|
||||
}).
|
||||
@@ -1681,14 +1732,14 @@ function $CompileProvider($provide) {
|
||||
throw $compileMinErr('tpload', 'Failed to load template: {0}', config.url);
|
||||
});
|
||||
|
||||
return function delayedNodeLinkFn(ignoreChildLinkFn, scope, node, rootElement, controller) {
|
||||
return function delayedNodeLinkFn(ignoreChildLinkFn, scope, node, rootElement, boundTranscludeFn) {
|
||||
if (linkQueue) {
|
||||
linkQueue.push(scope);
|
||||
linkQueue.push(node);
|
||||
linkQueue.push(rootElement);
|
||||
linkQueue.push(controller);
|
||||
linkQueue.push(boundTranscludeFn);
|
||||
} else {
|
||||
afterTemplateNodeLinkFn(afterTemplateChildLinkFn, scope, node, rootElement, controller);
|
||||
afterTemplateNodeLinkFn(afterTemplateChildLinkFn, scope, node, rootElement, boundTranscludeFn);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
@@ -21,7 +21,7 @@ var nullFormCtrl = {
|
||||
* @property {Object} $error Is an object hash, containing references to all invalid controls or
|
||||
* forms, where:
|
||||
*
|
||||
* - keys are validation tokens (error names) — such as `required`, `url` or `email`),
|
||||
* - keys are validation tokens (error names) — such as `required`, `url` or `email`,
|
||||
* - values are arrays of controls or forms that are invalid with given error.
|
||||
*
|
||||
* @description
|
||||
|
||||
@@ -840,6 +840,11 @@ var VALID_CLASS = 'ng-valid',
|
||||
* }
|
||||
* ngModel.$formatters.push(formatter);
|
||||
* </pre>
|
||||
*
|
||||
* @property {Array.<Function>} $viewChangeListeners Array of functions to execute whenever the
|
||||
* view value has changed. It is called with no arguments, and its return value is ignored.
|
||||
* This can be used in place of additional $watches against the model value.
|
||||
*
|
||||
* @property {Object} $error An object hash with all errors as keys.
|
||||
*
|
||||
* @property {boolean} $pristine True if user has not interacted with the control yet.
|
||||
@@ -1103,14 +1108,19 @@ var NgModelController = ['$scope', '$exceptionHandler', '$attrs', '$element', '$
|
||||
* @methodOf ng.directive:ngModel.NgModelController
|
||||
*
|
||||
* @description
|
||||
* Read a value from view.
|
||||
* Update the view value.
|
||||
*
|
||||
* This method should be called from within a DOM event handler.
|
||||
* For example {@link ng.directive:input input} or
|
||||
* This method should be called when the view value changes, typically from within a DOM event handler.
|
||||
* For example {@link ng.directive:input input} and
|
||||
* {@link ng.directive:select select} directives call it.
|
||||
*
|
||||
* It internally calls all `$parsers` (including validators) and updates the `$modelValue` and the actual model path.
|
||||
* Lastly it calls all registered change listeners.
|
||||
* It will update the $viewValue, then pass this value through each of the functions in `$parsers`,
|
||||
* which includes any validators. The value that comes out of this `$parsers` pipeline, be applied to
|
||||
* `$modelValue` and the **expression** specified in the `ng-model` attribute.
|
||||
*
|
||||
* Lastly, all the registered change listeners, in the `$viewChangeListeners` list, are called.
|
||||
*
|
||||
* Note that calling this function does not trigger a `$digest`.
|
||||
*
|
||||
* @param {string} value Value from the view.
|
||||
*/
|
||||
|
||||
+21
-15
@@ -138,27 +138,33 @@ var ngBindTemplateDirective = ['$interpolate', function($interpolate) {
|
||||
* @param {expression} ngBindHtml {@link guide/expression Expression} to evaluate.
|
||||
*
|
||||
* @example
|
||||
* Try it here: enter text in text box and watch the greeting change.
|
||||
<doc:example module="ngBindHtmlExample" deps="angular-sanitize.js" >
|
||||
<doc:source>
|
||||
<script>
|
||||
angular.module('ngBindHtmlExample', ['ngSanitize'])
|
||||
|
||||
.controller('ngBindHtmlCtrl', ['$scope', function ngBindHtmlCtrl($scope) {
|
||||
$scope.myHTML = 'I am an <code>HTML</code>string with <a href="#">links!</a> and other <em>stuff</em>';
|
||||
}]);
|
||||
</script>
|
||||
Try it here: enter text in text box and watch the greeting change.
|
||||
|
||||
<example module="ngBindHtmlExample" deps="angular-sanitize.js">
|
||||
<file name="index.html">
|
||||
<div ng-controller="ngBindHtmlCtrl">
|
||||
<p ng-bind-html="myHTML"></p>
|
||||
</div>
|
||||
</doc:source>
|
||||
<doc:scenario>
|
||||
</file>
|
||||
|
||||
<file name="script.js">
|
||||
angular.module('ngBindHtmlExample', ['ngSanitize'])
|
||||
|
||||
.controller('ngBindHtmlCtrl', ['$scope', function ngBindHtmlCtrl($scope) {
|
||||
$scope.myHTML =
|
||||
'I am an <code>HTML</code>string with <a href="#">links!</a> and other <em>stuff</em>';
|
||||
}]);
|
||||
</file>
|
||||
|
||||
<file name="scenario.js">
|
||||
it('should check ng-bind-html', function() {
|
||||
expect(using('.doc-example-live').binding('myHTML')).
|
||||
toBe('I am an <code>HTML</code>string with <a href="#">links!</a> and other <em>stuff</em>');
|
||||
toBe(
|
||||
'I am an <code>HTML</code>string with <a href="#">links!</a> and other <em>stuff</em>'
|
||||
);
|
||||
});
|
||||
</doc:scenario>
|
||||
</doc:example>
|
||||
</file>
|
||||
</example>
|
||||
*/
|
||||
var ngBindHtmlDirective = ['$sce', '$parse', function($sce, $parse) {
|
||||
return function(scope, element, attr) {
|
||||
|
||||
@@ -98,18 +98,18 @@ function classDirective(name, selector) {
|
||||
* @example Example that demonstrates basic bindings via ngClass directive.
|
||||
<example>
|
||||
<file name="index.html">
|
||||
<p ng-class="{strike: strike, bold: bold, red: red}">Map Syntax Example</p>
|
||||
<input type="checkbox" ng-model="bold"> bold
|
||||
<input type="checkbox" ng-model="strike"> strike
|
||||
<input type="checkbox" ng-model="red"> red
|
||||
<p ng-class="{strike: deleted, bold: important, red: error}">Map Syntax Example</p>
|
||||
<input type="checkbox" ng-model="deleted"> deleted (apply "strike" class)<br>
|
||||
<input type="checkbox" ng-model="important"> important (apply "bold" class)<br>
|
||||
<input type="checkbox" ng-model="error"> error (apply "red" class)
|
||||
<hr>
|
||||
<p ng-class="style">Using String Syntax</p>
|
||||
<input type="text" ng-model="style" placeholder="Type: bold strike red">
|
||||
<hr>
|
||||
<p ng-class="[style1, style2, style3]">Using Array Syntax</p>
|
||||
<input ng-model="style1" placeholder="Type: bold"><br>
|
||||
<input ng-model="style2" placeholder="Type: strike"><br>
|
||||
<input ng-model="style3" placeholder="Type: red"><br>
|
||||
<input ng-model="style1" placeholder="Type: bold, strike or red"><br>
|
||||
<input ng-model="style2" placeholder="Type: bold, strike or red"><br>
|
||||
<input ng-model="style3" placeholder="Type: bold, strike or red"><br>
|
||||
</file>
|
||||
<file name="style.css">
|
||||
.strike {
|
||||
@@ -128,10 +128,10 @@ function classDirective(name, selector) {
|
||||
expect(element('.doc-example-live p:first').prop('className')).not().toMatch(/bold/);
|
||||
expect(element('.doc-example-live p:first').prop('className')).not().toMatch(/red/);
|
||||
|
||||
input('bold').check();
|
||||
input('important').check();
|
||||
expect(element('.doc-example-live p:first').prop('className')).toMatch(/bold/);
|
||||
|
||||
input('red').check();
|
||||
input('error').check();
|
||||
expect(element('.doc-example-live p:first').prop('className')).toMatch(/red/);
|
||||
});
|
||||
|
||||
|
||||
+12
-14
@@ -60,7 +60,7 @@
|
||||
}
|
||||
|
||||
/*
|
||||
The transition styles can also be placed on the CSS base class above
|
||||
The transition styles can also be placed on the CSS base class above
|
||||
*/
|
||||
.animate-if.ng-enter, .animate-if.ng-leave {
|
||||
-webkit-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
|
||||
@@ -86,22 +86,21 @@ var ngIfDirective = ['$animate', function($animate) {
|
||||
terminal: true,
|
||||
restrict: 'A',
|
||||
$$tlb: true,
|
||||
compile: function (element, attr, transclude) {
|
||||
return function ($scope, $element, $attr) {
|
||||
link: function ($scope, $element, $attr, ctrl, $transclude) {
|
||||
var block, childScope;
|
||||
$scope.$watch($attr.ngIf, function ngIfWatchAction(value) {
|
||||
|
||||
if (toBoolean(value)) {
|
||||
|
||||
childScope = $scope.$new();
|
||||
transclude(childScope, function (clone) {
|
||||
block = {
|
||||
startNode: clone[0],
|
||||
endNode: clone[clone.length++] = document.createComment(' end ngIf: ' + $attr.ngIf + ' ')
|
||||
};
|
||||
$animate.enter(clone, $element.parent(), $element);
|
||||
});
|
||||
|
||||
if (!childScope) {
|
||||
childScope = $scope.$new();
|
||||
$transclude(childScope, function (clone) {
|
||||
block = {
|
||||
startNode: clone[0],
|
||||
endNode: clone[clone.length++] = document.createComment(' end ngIf: ' + $attr.ngIf + ' ')
|
||||
};
|
||||
$animate.enter(clone, $element.parent(), $element);
|
||||
});
|
||||
}
|
||||
} else {
|
||||
|
||||
if (childScope) {
|
||||
@@ -115,7 +114,6 @@ var ngIfDirective = ['$animate', function($animate) {
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
}
|
||||
};
|
||||
}];
|
||||
|
||||
@@ -154,12 +154,12 @@ var ngIncludeDirective = ['$http', '$templateCache', '$anchorScroll', '$compile'
|
||||
priority: 400,
|
||||
terminal: true,
|
||||
transclude: 'element',
|
||||
compile: function(element, attr, transclusion) {
|
||||
compile: function(element, attr) {
|
||||
var srcExp = attr.ngInclude || attr.src,
|
||||
onloadExp = attr.onload || '',
|
||||
autoScrollExp = attr.autoscroll;
|
||||
|
||||
return function(scope, $element) {
|
||||
return function(scope, $element, $attr, ctrl, $transclude) {
|
||||
var changeCounter = 0,
|
||||
currentScope,
|
||||
currentElement;
|
||||
@@ -188,7 +188,7 @@ var ngIncludeDirective = ['$http', '$templateCache', '$anchorScroll', '$compile'
|
||||
if (thisChangeId !== changeCounter) return;
|
||||
var newScope = scope.$new();
|
||||
|
||||
transclusion(newScope, function(clone) {
|
||||
$transclude(newScope, function(clone) {
|
||||
cleanupLastIncludeContent();
|
||||
|
||||
currentScope = newScope;
|
||||
|
||||
@@ -201,8 +201,7 @@ var ngRepeatDirective = ['$parse', '$animate', function($parse, $animate) {
|
||||
priority: 1000,
|
||||
terminal: true,
|
||||
$$tlb: true,
|
||||
compile: function(element, attr, linker) {
|
||||
return function($scope, $element, $attr){
|
||||
link: function($scope, $element, $attr, ctrl, $transclude){
|
||||
var expression = $attr.ngRepeat;
|
||||
var match = expression.match(/^\s*(.+)\s+in\s+(.*?)\s*(\s+track\s+by\s+(.+)\s*)?$/),
|
||||
trackByExp, trackByExpGetter, trackByIdExpFn, trackByIdArrayFn, trackByIdObjFn,
|
||||
@@ -364,7 +363,7 @@ var ngRepeatDirective = ['$parse', '$animate', function($parse, $animate) {
|
||||
// jshint bitwise: true
|
||||
|
||||
if (!block.startNode) {
|
||||
linker(childScope, function(clone) {
|
||||
$transclude(childScope, function(clone) {
|
||||
clone[clone.length++] = document.createComment(' end ngRepeat: ' + expression + ' ');
|
||||
$animate.enter(clone, null, jqLite(previousNode));
|
||||
previousNode = clone;
|
||||
@@ -377,7 +376,6 @@ var ngRepeatDirective = ['$parse', '$animate', function($parse, $animate) {
|
||||
}
|
||||
lastBlockMap = nextBlockMap;
|
||||
});
|
||||
};
|
||||
}
|
||||
};
|
||||
}];
|
||||
|
||||
@@ -160,10 +160,10 @@ var ngSwitchWhenDirective = ngDirective({
|
||||
transclude: 'element',
|
||||
priority: 800,
|
||||
require: '^ngSwitch',
|
||||
compile: function(element, attrs, transclude) {
|
||||
return function(scope, element, attr, ctrl) {
|
||||
compile: function(element, attrs) {
|
||||
return function(scope, element, attr, ctrl, $transclude) {
|
||||
ctrl.cases['!' + attrs.ngSwitchWhen] = (ctrl.cases['!' + attrs.ngSwitchWhen] || []);
|
||||
ctrl.cases['!' + attrs.ngSwitchWhen].push({ transclude: transclude, element: element });
|
||||
ctrl.cases['!' + attrs.ngSwitchWhen].push({ transclude: $transclude, element: element });
|
||||
};
|
||||
}
|
||||
});
|
||||
@@ -172,10 +172,8 @@ var ngSwitchDefaultDirective = ngDirective({
|
||||
transclude: 'element',
|
||||
priority: 800,
|
||||
require: '^ngSwitch',
|
||||
compile: function(element, attrs, transclude) {
|
||||
return function(scope, element, attr, ctrl) {
|
||||
ctrl.cases['?'] = (ctrl.cases['?'] || []);
|
||||
ctrl.cases['?'].push({ transclude: transclude, element: element });
|
||||
};
|
||||
}
|
||||
link: function(scope, element, attr, ctrl, $transclude) {
|
||||
ctrl.cases['?'] = (ctrl.cases['?'] || []);
|
||||
ctrl.cases['?'].push({ transclude: $transclude, element: element });
|
||||
}
|
||||
});
|
||||
|
||||
+11
-5
@@ -324,9 +324,11 @@ function $HttpProvider() {
|
||||
*
|
||||
* # Caching
|
||||
*
|
||||
* To enable caching, set the configuration property `cache` to `true`. When the cache is
|
||||
* enabled, `$http` stores the response from the server in local cache. Next time the
|
||||
* response is served from the cache without sending a request to the server.
|
||||
* To enable caching, set the request configuration `cache` property to `true` (to use default
|
||||
* cache) or to a custom cache object (built with {@link ng.$cacheFactory `$cacheFactory`}).
|
||||
* When the cache is enabled, `$http` stores the response from the server in the specified
|
||||
* cache. The next time the same request is made, the response is served from the cache without
|
||||
* sending a request to the server.
|
||||
*
|
||||
* Note that even if the response is served from cache, delivery of the data is asynchronous in
|
||||
* the same way that real requests are.
|
||||
@@ -335,9 +337,13 @@ function $HttpProvider() {
|
||||
* cache, but the cache is not populated yet, only one request to the server will be made and
|
||||
* the remaining requests will be fulfilled using the response from the first request.
|
||||
*
|
||||
* A custom default cache built with $cacheFactory can be provided in $http.defaults.cache.
|
||||
* To skip it, set configuration property `cache` to `false`.
|
||||
* You can change the default cache to a new object (built with
|
||||
* {@link ng.$cacheFactory `$cacheFactory`}) by updating the
|
||||
* {@link ng.$http#properties_defaults `$http.defaults.cache`} property. All requests who set
|
||||
* their `cache` property to `true` will now use this cache object.
|
||||
*
|
||||
* If you set the default cache to `false` then only requests that specify their own custom
|
||||
* cache object will be cached.
|
||||
*
|
||||
* # Interceptors
|
||||
*
|
||||
|
||||
+8
-8
@@ -22,8 +22,8 @@ function encodePath(path) {
|
||||
return segments.join('/');
|
||||
}
|
||||
|
||||
function parseAbsoluteUrl(absoluteUrl, locationObj) {
|
||||
var parsedUrl = urlResolve(absoluteUrl);
|
||||
function parseAbsoluteUrl(absoluteUrl, locationObj, appBase) {
|
||||
var parsedUrl = urlResolve(absoluteUrl, appBase);
|
||||
|
||||
locationObj.$$protocol = parsedUrl.protocol;
|
||||
locationObj.$$host = parsedUrl.hostname;
|
||||
@@ -31,12 +31,12 @@ function parseAbsoluteUrl(absoluteUrl, locationObj) {
|
||||
}
|
||||
|
||||
|
||||
function parseAppUrl(relativeUrl, locationObj) {
|
||||
function parseAppUrl(relativeUrl, locationObj, appBase) {
|
||||
var prefixed = (relativeUrl.charAt(0) !== '/');
|
||||
if (prefixed) {
|
||||
relativeUrl = '/' + relativeUrl;
|
||||
}
|
||||
var match = urlResolve(relativeUrl);
|
||||
var match = urlResolve(relativeUrl, appBase);
|
||||
locationObj.$$path = decodeURIComponent(prefixed && match.pathname.charAt(0) === '/' ?
|
||||
match.pathname.substring(1) : match.pathname);
|
||||
locationObj.$$search = parseKeyValue(match.search);
|
||||
@@ -91,7 +91,7 @@ function LocationHtml5Url(appBase, basePrefix) {
|
||||
this.$$html5 = true;
|
||||
basePrefix = basePrefix || '';
|
||||
var appBaseNoFile = stripFile(appBase);
|
||||
parseAbsoluteUrl(appBase, this);
|
||||
parseAbsoluteUrl(appBase, this, appBase);
|
||||
|
||||
|
||||
/**
|
||||
@@ -106,7 +106,7 @@ function LocationHtml5Url(appBase, basePrefix) {
|
||||
appBaseNoFile);
|
||||
}
|
||||
|
||||
parseAppUrl(pathUrl, this);
|
||||
parseAppUrl(pathUrl, this, appBase);
|
||||
|
||||
if (!this.$$path) {
|
||||
this.$$path = '/';
|
||||
@@ -158,7 +158,7 @@ function LocationHtml5Url(appBase, basePrefix) {
|
||||
function LocationHashbangUrl(appBase, hashPrefix) {
|
||||
var appBaseNoFile = stripFile(appBase);
|
||||
|
||||
parseAbsoluteUrl(appBase, this);
|
||||
parseAbsoluteUrl(appBase, this, appBase);
|
||||
|
||||
|
||||
/**
|
||||
@@ -178,7 +178,7 @@ function LocationHashbangUrl(appBase, hashPrefix) {
|
||||
throw $locationMinErr('ihshprfx', 'Invalid url "{0}", missing hash prefix "{1}".', url,
|
||||
hashPrefix);
|
||||
}
|
||||
parseAppUrl(withoutHashUrl, this);
|
||||
parseAppUrl(withoutHashUrl, this, appBase);
|
||||
this.$$compose();
|
||||
};
|
||||
|
||||
|
||||
+9
-25
@@ -8,23 +8,18 @@ var promiseWarning;
|
||||
// ------------------------------
|
||||
// Angular expressions are generally considered safe because these expressions only have direct
|
||||
// access to $scope and locals. However, one can obtain the ability to execute arbitrary JS code by
|
||||
// obtaining a reference to native JS functions such as the Function constructor, the global Window
|
||||
// or Document object. In addition, many powerful functions for use by JavaScript code are
|
||||
// published on scope that shouldn't be available from within an Angular expression.
|
||||
// obtaining a reference to native JS functions such as the Function constructor.
|
||||
//
|
||||
// As an example, consider the following Angular expression:
|
||||
//
|
||||
// {}.toString.constructor(alert("evil JS code"))
|
||||
//
|
||||
// We want to prevent this type of access. For the sake of performance, during the lexing phase we
|
||||
// disallow any "dotted" access to any member named "constructor" or to any member whose name begins
|
||||
// or ends with an underscore. The latter allows one to exclude the private / JavaScript only API
|
||||
// available on the scope and controllers from the context of an Angular expression.
|
||||
// disallow any "dotted" access to any member named "constructor".
|
||||
//
|
||||
// For reflective calls (a[b]), we check that the value of the lookup is not the Function
|
||||
// constructor, Window or DOM node while evaluating the expression, which is a stronger but more
|
||||
// expensive test. Since reflective calls are expensive anyway, this is not such a big deal compared
|
||||
// to static dereferencing.
|
||||
// For reflective calls (a[b]) we check that the value of the lookup is not the Function constructor
|
||||
// while evaluating the expression, which is a stronger but more expensive test. Since reflective
|
||||
// calls are expensive anyway, this is not such a big deal compared to static dereferencing.
|
||||
//
|
||||
// This sandboxing technique is not perfect and doesn't aim to be. The goal is to prevent exploits
|
||||
// against the expression language, but not to prevent exploits that were enabled by exposing
|
||||
@@ -38,20 +33,12 @@ var promiseWarning;
|
||||
// In general, it is not possible to access a Window object from an angular expression unless a
|
||||
// window or some DOM object that has a reference to window is published onto a Scope.
|
||||
|
||||
function ensureSafeMemberName(name, fullExpression, allowConstructor) {
|
||||
if (typeof name !== 'string' && toString.apply(name) !== "[object String]") {
|
||||
return name;
|
||||
}
|
||||
if (name === "constructor" && !allowConstructor) {
|
||||
function ensureSafeMemberName(name, fullExpression) {
|
||||
if (name === "constructor") {
|
||||
throw $parseMinErr('isecfld',
|
||||
'Referencing "constructor" field in Angular expressions is disallowed! Expression: {0}',
|
||||
fullExpression);
|
||||
}
|
||||
if (name.charAt(0) === '_' || name.charAt(name.length-1) === '_') {
|
||||
throw $parseMinErr('isecprv',
|
||||
'Referencing private fields in Angular expressions is disallowed! Expression: {0}',
|
||||
fullExpression);
|
||||
}
|
||||
return name;
|
||||
}
|
||||
|
||||
@@ -735,10 +722,7 @@ Parser.prototype = {
|
||||
|
||||
return extend(function(self, locals) {
|
||||
var o = obj(self, locals),
|
||||
// In the getter, we will not block looking up "constructor" by name in order to support user defined
|
||||
// constructors. However, if value looked up is the Function constructor, we will still block it in the
|
||||
// ensureSafeObject call right after we look up o[i] (a few lines below.)
|
||||
i = ensureSafeMemberName(indexFn(self, locals), parser.text, true /* allowConstructor */),
|
||||
i = indexFn(self, locals),
|
||||
v, p;
|
||||
|
||||
if (!o) return undefined;
|
||||
@@ -754,7 +738,7 @@ Parser.prototype = {
|
||||
return v;
|
||||
}, {
|
||||
assign: function(self, value, locals) {
|
||||
var key = ensureSafeMemberName(indexFn(self, locals), parser.text);
|
||||
var key = indexFn(self, locals);
|
||||
// prevent overwriting of Function.constructor which would break ensureSafeObject check
|
||||
var safe = ensureSafeObject(obj(self, locals), parser.text);
|
||||
return safe[key] = value;
|
||||
|
||||
+1
-1
@@ -165,7 +165,7 @@
|
||||
* // Propagate promise resolution to 'then' functions using $apply().
|
||||
* $rootScope.$apply();
|
||||
* expect(resolvedValue).toEqual(123);
|
||||
* });
|
||||
* }));
|
||||
* </pre>
|
||||
*/
|
||||
function $QProvider() {
|
||||
|
||||
+2
-2
@@ -427,10 +427,10 @@ function $SceDelegateProvider() {
|
||||
*
|
||||
* <pre class="prettyprint">
|
||||
* <input ng-model="userHtml">
|
||||
* <div ng-bind-html="{{userHtml}}">
|
||||
* <div ng-bind-html="userHtml">
|
||||
* </pre>
|
||||
*
|
||||
* Notice that `ng-bind-html` is bound to `{{userHtml}}` controlled by the user. With SCE
|
||||
* Notice that `ng-bind-html` is bound to `userHtml` controlled by the user. With SCE
|
||||
* disabled, this application allows the user to render arbitrary HTML into the DIV.
|
||||
* In a more realistic example, one may be rendering user comments, blog articles, etc. via
|
||||
* bindings. (HTML is just one example of a context where rendering user controlled input creates
|
||||
|
||||
+48
-6
@@ -7,8 +7,14 @@
|
||||
// exactly the behavior needed here. There is little value is mocking these out for this
|
||||
// service.
|
||||
var urlParsingNode = document.createElement("a");
|
||||
/*
|
||||
Matches paths for file protocol on windows,
|
||||
such as /C:/foo/bar, and captures only /foo/bar.
|
||||
*/
|
||||
var windowsFilePathExp = /^\/?.*?:(\/.*)/;
|
||||
var originUrl = urlResolve(window.location.href, true);
|
||||
|
||||
|
||||
/**
|
||||
*
|
||||
* Implementation Notes for non-IE browsers
|
||||
@@ -27,7 +33,7 @@ var originUrl = urlResolve(window.location.href, true);
|
||||
* browsers. However, the parsed components will not be set if the URL assigned did not specify
|
||||
* them. (e.g. if you assign a.href = "foo", then a.protocol, a.host, etc. will be empty.) We
|
||||
* work around that by performing the parsing in a 2nd step by taking a previously normalized
|
||||
* URL (e.g. by assining to a.href) and assigning it a.href again. This correctly populates the
|
||||
* URL (e.g. by assigning to a.href) and assigning it a.href again. This correctly populates the
|
||||
* properties such as protocol, hostname, port, etc.
|
||||
*
|
||||
* IE7 does not normalize the URL when assigned to an anchor node. (Apparently, it does, if one
|
||||
@@ -61,8 +67,10 @@ var originUrl = urlResolve(window.location.href, true);
|
||||
* | pathname | The pathname, beginning with "/"
|
||||
*
|
||||
*/
|
||||
function urlResolve(url) {
|
||||
var href = url;
|
||||
function urlResolve(url, base) {
|
||||
var href = url,
|
||||
pathname;
|
||||
|
||||
if (msie) {
|
||||
// Normalize before parse. Refer Implementation Notes on why this is
|
||||
// done in two steps on IE.
|
||||
@@ -72,7 +80,22 @@ function urlResolve(url) {
|
||||
|
||||
urlParsingNode.setAttribute('href', href);
|
||||
|
||||
// $$urlParsingNode provides the UrlUtils interface - http://url.spec.whatwg.org/#urlutils
|
||||
/*
|
||||
* In Windows, on an anchor node on documents loaded from
|
||||
* the filesystem, the browser will return a pathname
|
||||
* prefixed with the drive name ('/C:/path') when a
|
||||
* pathname without a drive is set:
|
||||
* * a.setAttribute('href', '/foo')
|
||||
* * a.pathname === '/C:/foo' //true
|
||||
*
|
||||
* Inside of Angular, we're always using pathnames that
|
||||
* do not include drive names for routing.
|
||||
*/
|
||||
|
||||
pathname = removeWindowsDriveName(urlParsingNode.pathname, url, base);
|
||||
pathname = (pathname.charAt(0) === '/') ? pathname : '/' + pathname;
|
||||
|
||||
// urlParsingNode provides the UrlUtils interface - http://url.spec.whatwg.org/#urlutils
|
||||
return {
|
||||
href: urlParsingNode.href,
|
||||
protocol: urlParsingNode.protocol ? urlParsingNode.protocol.replace(/:$/, '') : '',
|
||||
@@ -81,8 +104,7 @@ function urlResolve(url) {
|
||||
hash: urlParsingNode.hash ? urlParsingNode.hash.replace(/^#/, '') : '',
|
||||
hostname: urlParsingNode.hostname,
|
||||
port: urlParsingNode.port,
|
||||
pathname: urlParsingNode.pathname && urlParsingNode.pathname.charAt(0) === '/' ?
|
||||
urlParsingNode.pathname : '/' + urlParsingNode.pathname
|
||||
pathname: pathname
|
||||
};
|
||||
}
|
||||
|
||||
@@ -99,3 +121,23 @@ function urlIsSameOrigin(requestUrl) {
|
||||
return (parsed.protocol === originUrl.protocol &&
|
||||
parsed.host === originUrl.host);
|
||||
}
|
||||
|
||||
function removeWindowsDriveName (path, url, base) {
|
||||
var firstPathSegmentMatch;
|
||||
|
||||
//Get the relative path from the input URL.
|
||||
if (url.indexOf(base) === 0) {
|
||||
url = url.replace(base, '');
|
||||
}
|
||||
|
||||
/*
|
||||
* The input URL intentionally contains a
|
||||
* first path segment that ends with a colon.
|
||||
*/
|
||||
if (windowsFilePathExp.exec(url)) {
|
||||
return path;
|
||||
}
|
||||
|
||||
firstPathSegmentMatch = windowsFilePathExp.exec(path);
|
||||
return firstPathSegmentMatch ? firstPathSegmentMatch[1] : path;
|
||||
}
|
||||
Vendored
+1
-16
@@ -1657,21 +1657,6 @@ angular.mock.$TimeoutDecorator = function($delegate, $browser) {
|
||||
$browser.defer.flush(delay);
|
||||
};
|
||||
|
||||
/**
|
||||
* @ngdoc method
|
||||
* @name ngMock.$timeout#flushNext
|
||||
* @methodOf ngMock.$timeout
|
||||
* @description
|
||||
*
|
||||
* Flushes the next timeout in the queue and compares it to the provided delay
|
||||
*
|
||||
* @param {number=} expectedDelay the delay value that will be asserted against the delay of the
|
||||
* next timeout function
|
||||
*/
|
||||
$delegate.flushNext = function(expectedDelay) {
|
||||
$browser.defer.flushNext(expectedDelay);
|
||||
};
|
||||
|
||||
/**
|
||||
* @ngdoc method
|
||||
* @name ngMock.$timeout#verifyNoPendingTasks
|
||||
@@ -2127,4 +2112,4 @@ angular.mock.clearDataCache = function() {
|
||||
}
|
||||
}
|
||||
};
|
||||
})(window);
|
||||
})(window);
|
||||
|
||||
+27
-59
@@ -2,6 +2,28 @@
|
||||
|
||||
var $resourceMinErr = angular.$$minErr('$resource');
|
||||
|
||||
// Helper functions and regex to lookup a dotted path on an object
|
||||
// stopping at undefined/null. The path must be composed of ASCII
|
||||
// identifiers (just like $parse)
|
||||
var MEMBER_NAME_REGEX = /^(\.[a-zA-Z_$][0-9a-zA-Z_$]*)+$/;
|
||||
|
||||
function isValidDottedPath(path) {
|
||||
return (path != null && path !== '' && path !== 'hasOwnProperty' &&
|
||||
MEMBER_NAME_REGEX.test('.' + path));
|
||||
}
|
||||
|
||||
function lookupDottedPath(obj, path) {
|
||||
if (!isValidDottedPath(path)) {
|
||||
throw $resourceMinErr('badmember', 'Dotted member path "@{0}" is invalid.', path);
|
||||
}
|
||||
var keys = path.split('.');
|
||||
for (var i = 0, ii = keys.length; i < ii && obj !== undefined; i++) {
|
||||
var key = keys[i];
|
||||
obj = (obj !== null) ? obj[key] : undefined;
|
||||
}
|
||||
return obj;
|
||||
}
|
||||
|
||||
/**
|
||||
* @ngdoc overview
|
||||
* @name ngResource
|
||||
@@ -129,7 +151,7 @@ var $resourceMinErr = angular.$$minErr('$resource');
|
||||
* usually the resource is assigned to a model which is then rendered by the view. Having an empty
|
||||
* object results in no rendering, once the data arrives from the server then the object is
|
||||
* populated with the data and the view automatically re-renders itself showing the new data. This
|
||||
* means that in most case one never has to write a callback function for the action methods.
|
||||
* means that in most cases one never has to write a callback function for the action methods.
|
||||
*
|
||||
* The action methods on the class object or instance object can be invoked with the following
|
||||
* parameters:
|
||||
@@ -231,61 +253,10 @@ var $resourceMinErr = angular.$$minErr('$resource');
|
||||
});
|
||||
});
|
||||
</pre>
|
||||
|
||||
* # Buzz client
|
||||
|
||||
Let's look at what a buzz client created with the `$resource` service looks like:
|
||||
<doc:example>
|
||||
<doc:source jsfiddle="false">
|
||||
<script>
|
||||
function BuzzController($resource) {
|
||||
this.userId = 'googlebuzz';
|
||||
this.Activity = $resource(
|
||||
'https://www.googleapis.com/buzz/v1/activities/:userId/:visibility/:activityId/:comments',
|
||||
{alt:'json', callback:'JSON_CALLBACK'},
|
||||
{
|
||||
get:{method:'JSONP', params:{visibility:'@self'}},
|
||||
replies: {method:'JSONP', params:{visibility:'@self', comments:'@comments'}}
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
BuzzController.prototype = {
|
||||
fetch: function() {
|
||||
this.activities = this.Activity.get({userId:this.userId});
|
||||
},
|
||||
expandReplies: function(activity) {
|
||||
activity.replies = this.Activity.replies({userId:this.userId, activityId:activity.id});
|
||||
}
|
||||
};
|
||||
BuzzController.$inject = ['$resource'];
|
||||
</script>
|
||||
|
||||
<div ng-controller="BuzzController">
|
||||
<input ng-model="userId"/>
|
||||
<button ng-click="fetch()">fetch</button>
|
||||
<hr/>
|
||||
<div ng-repeat="item in activities.data.items">
|
||||
<h1 style="font-size: 15px;">
|
||||
<img src="{{item.actor.thumbnailUrl}}" style="max-height:30px;max-width:30px;"/>
|
||||
<a href="{{item.actor.profileUrl}}">{{item.actor.name}}</a>
|
||||
<a href ng-click="expandReplies(item)" style="float: right;">Expand replies:
|
||||
{{item.links.replies[0].count}}</a>
|
||||
</h1>
|
||||
{{item.object.content | html}}
|
||||
<div ng-repeat="reply in item.replies.data.items" style="margin-left: 20px;">
|
||||
<img src="{{reply.actor.thumbnailUrl}}" style="max-height:30px;max-width:30px;"/>
|
||||
<a href="{{reply.actor.profileUrl}}">{{reply.actor.name}}</a>: {{reply.content | html}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</doc:source>
|
||||
<doc:scenario>
|
||||
</doc:scenario>
|
||||
</doc:example>
|
||||
*/
|
||||
angular.module('ngResource', ['ng']).
|
||||
factory('$resource', ['$http', '$parse', '$q', function($http, $parse, $q) {
|
||||
factory('$resource', ['$http', '$q', function($http, $q) {
|
||||
|
||||
var DEFAULT_ACTIONS = {
|
||||
'get': {method:'GET'},
|
||||
'save': {method:'POST'},
|
||||
@@ -297,10 +268,7 @@ angular.module('ngResource', ['ng']).
|
||||
forEach = angular.forEach,
|
||||
extend = angular.extend,
|
||||
copy = angular.copy,
|
||||
isFunction = angular.isFunction,
|
||||
getter = function(obj, path) {
|
||||
return $parse(path)(obj);
|
||||
};
|
||||
isFunction = angular.isFunction;
|
||||
|
||||
/**
|
||||
* We need our custom method because encodeURIComponent is too aggressive and doesn't follow
|
||||
@@ -415,7 +383,7 @@ angular.module('ngResource', ['ng']).
|
||||
forEach(actionParams, function(value, key){
|
||||
if (isFunction(value)) { value = value(); }
|
||||
ids[key] = value && value.charAt && value.charAt(0) == '@' ?
|
||||
getter(data, value.substr(1)) : value;
|
||||
lookupDottedPath(data, value.substr(1)) : value;
|
||||
});
|
||||
return ids;
|
||||
}
|
||||
|
||||
@@ -173,8 +173,7 @@ function ngViewFactory( $route, $anchorScroll, $compile, $controller,
|
||||
terminal: true,
|
||||
priority: 400,
|
||||
transclude: 'element',
|
||||
compile: function(element, attr, linker) {
|
||||
return function(scope, $element, attr) {
|
||||
link: function(scope, $element, attr, ctrl, $transclude) {
|
||||
var currentScope,
|
||||
currentElement,
|
||||
autoScrollExp = attr.autoscroll,
|
||||
@@ -200,7 +199,7 @@ function ngViewFactory( $route, $anchorScroll, $compile, $controller,
|
||||
|
||||
if (template) {
|
||||
var newScope = scope.$new();
|
||||
linker(newScope, function(clone) {
|
||||
$transclude(newScope, function(clone) {
|
||||
clone.html(template);
|
||||
$animate.enter(clone, null, currentElement || $element, function onNgViewEnter () {
|
||||
if (angular.isDefined(autoScrollExp)
|
||||
@@ -235,7 +234,6 @@ function ngViewFactory( $route, $anchorScroll, $compile, $controller,
|
||||
cleanupLastView();
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
+219
-3
@@ -504,6 +504,14 @@ describe('$compile', function() {
|
||||
expect(element).toBe(attr.$$element);
|
||||
}
|
||||
}));
|
||||
directive('replaceWithInterpolatedStyle', valueFn({
|
||||
replace: true,
|
||||
template: '<div style="width:{{1+1}}px">Replace with interpolated style!</div>',
|
||||
compile: function(element, attr) {
|
||||
attr.$set('compiled', 'COMPILED');
|
||||
expect(element).toBe(attr.$$element);
|
||||
}
|
||||
}));
|
||||
}));
|
||||
|
||||
|
||||
@@ -581,13 +589,22 @@ describe('$compile', function() {
|
||||
}));
|
||||
|
||||
|
||||
it('should handle interpolated css from replacing directive', inject(
|
||||
it('should handle interpolated css class from replacing directive', inject(
|
||||
function($compile, $rootScope) {
|
||||
element = $compile('<div replace-with-interpolated-class></div>')($rootScope);
|
||||
$rootScope.$digest();
|
||||
expect(element).toHaveClass('class_2');
|
||||
}));
|
||||
|
||||
if (!msie || msie > 10) {
|
||||
// style interpolation not working on IE<11.
|
||||
it('should handle interpolated css style from replacing directive', inject(
|
||||
function($compile, $rootScope) {
|
||||
element = $compile('<div replace-with-interpolated-style></div>')($rootScope);
|
||||
$rootScope.$digest();
|
||||
expect(element.css('width')).toBe('2px');
|
||||
}));
|
||||
}
|
||||
|
||||
it('should merge interpolated css class', inject(function($compile, $rootScope) {
|
||||
element = $compile('<div class="one {{cls}} three" replace></div>')($rootScope);
|
||||
@@ -3421,6 +3438,113 @@ describe('$compile', function() {
|
||||
expect(log).toEqual('pre(); post(unicorn!)');
|
||||
});
|
||||
});
|
||||
|
||||
it('should copy the directive controller to all clones', function() {
|
||||
var transcludeCtrl, cloneCount = 2;
|
||||
module(function() {
|
||||
directive('transclude', valueFn({
|
||||
transclude: 'content',
|
||||
controller: function($transclude) {
|
||||
transcludeCtrl = this;
|
||||
},
|
||||
link: function(scope, el, attr, ctrl, $transclude) {
|
||||
var i;
|
||||
for (i=0; i<cloneCount; i++) {
|
||||
$transclude(cloneAttach);
|
||||
}
|
||||
|
||||
function cloneAttach(clone) {
|
||||
el.append(clone);
|
||||
}
|
||||
}
|
||||
}));
|
||||
});
|
||||
inject(function($compile) {
|
||||
element = $compile('<div transclude><span></span></div>')($rootScope);
|
||||
var children = element.children(), i;
|
||||
expect(transcludeCtrl).toBeDefined();
|
||||
|
||||
expect(element.data('$transcludeController')).toBe(transcludeCtrl);
|
||||
for (i=0; i<cloneCount; i++) {
|
||||
expect(children.eq(i).data('$transcludeController')).toBeUndefined();
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
it('should provide the $transclude controller local as 5th argument to the pre and post-link function', function() {
|
||||
var ctrlTransclude, preLinkTransclude, postLinkTransclude;
|
||||
module(function() {
|
||||
directive('transclude', valueFn({
|
||||
transclude: 'content',
|
||||
controller: function($transclude) {
|
||||
ctrlTransclude = $transclude;
|
||||
},
|
||||
compile: function() {
|
||||
return {
|
||||
pre: function(scope, el, attr, ctrl, $transclude) {
|
||||
preLinkTransclude = $transclude;
|
||||
},
|
||||
post: function(scope, el, attr, ctrl, $transclude) {
|
||||
postLinkTransclude = $transclude;
|
||||
}
|
||||
};
|
||||
}
|
||||
}));
|
||||
});
|
||||
inject(function($compile) {
|
||||
element = $compile('<div transclude></div>')($rootScope);
|
||||
expect(ctrlTransclude).toBeDefined();
|
||||
expect(ctrlTransclude).toBe(preLinkTransclude);
|
||||
expect(ctrlTransclude).toBe(postLinkTransclude);
|
||||
});
|
||||
});
|
||||
|
||||
it('should allow an optional scope argument in $transclude', function() {
|
||||
var capturedChildCtrl;
|
||||
module(function() {
|
||||
directive('transclude', valueFn({
|
||||
transclude: 'content',
|
||||
link: function(scope, element, attr, ctrl, $transclude) {
|
||||
$transclude(scope, function(clone) {
|
||||
element.append(clone);
|
||||
});
|
||||
}
|
||||
}));
|
||||
});
|
||||
inject(function($compile) {
|
||||
element = $compile('<div transclude>{{$id}}</div>')($rootScope);
|
||||
$rootScope.$apply();
|
||||
expect(element.text()).toBe($rootScope.$id);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
it('should expose the directive controller to transcluded children', function() {
|
||||
var capturedChildCtrl;
|
||||
module(function() {
|
||||
directive('transclude', valueFn({
|
||||
transclude: 'content',
|
||||
controller: function() {
|
||||
},
|
||||
link: function(scope, element, attr, ctrl, $transclude) {
|
||||
$transclude(function(clone) {
|
||||
element.append(clone);
|
||||
});
|
||||
}
|
||||
}));
|
||||
directive('child', valueFn({
|
||||
require: '^transclude',
|
||||
link: function(scope, element, attr, ctrl) {
|
||||
capturedChildCtrl = ctrl;
|
||||
}
|
||||
}));
|
||||
});
|
||||
inject(function($compile) {
|
||||
element = $compile('<div transclude><div child></div></div>')($rootScope);
|
||||
expect(capturedChildCtrl).toBeTruthy();
|
||||
});
|
||||
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
@@ -3454,7 +3578,6 @@ describe('$compile', function() {
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
it('should only allow one element transclusion per element', function() {
|
||||
module(function() {
|
||||
directive('first', valueFn({
|
||||
@@ -3603,8 +3726,101 @@ describe('$compile', function() {
|
||||
]);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
it('should allow to access $transclude in the same directive', function() {
|
||||
var _$transclude;
|
||||
module(function() {
|
||||
directive('transclude', valueFn({
|
||||
transclude: 'element',
|
||||
controller: function($transclude) {
|
||||
_$transclude = $transclude;
|
||||
}
|
||||
}));
|
||||
});
|
||||
inject(function($compile) {
|
||||
element = $compile('<div transclude></div>')($rootScope);
|
||||
expect(_$transclude).toBeDefined()
|
||||
});
|
||||
});
|
||||
|
||||
it('should copy the directive controller to all clones', function() {
|
||||
var transcludeCtrl, cloneCount = 2;
|
||||
module(function() {
|
||||
directive('transclude', valueFn({
|
||||
transclude: 'element',
|
||||
controller: function() {
|
||||
transcludeCtrl = this;
|
||||
},
|
||||
link: function(scope, el, attr, ctrl, $transclude) {
|
||||
var i;
|
||||
for (i=0; i<cloneCount; i++) {
|
||||
$transclude(cloneAttach);
|
||||
}
|
||||
|
||||
function cloneAttach(clone) {
|
||||
el.after(clone);
|
||||
}
|
||||
}
|
||||
}));
|
||||
});
|
||||
inject(function($compile) {
|
||||
element = $compile('<div><div transclude></div></div>')($rootScope);
|
||||
var children = element.children(), i;
|
||||
for (i=0; i<cloneCount; i++) {
|
||||
expect(children.eq(i).data('$transcludeController')).toBe(transcludeCtrl);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
it('should expose the directive controller to transcluded children', function() {
|
||||
var capturedTranscludeCtrl;
|
||||
module(function() {
|
||||
directive('transclude', valueFn({
|
||||
transclude: 'element',
|
||||
controller: function() {
|
||||
},
|
||||
link: function(scope, element, attr, ctrl, $transclude) {
|
||||
$transclude(scope, function(clone) {
|
||||
element.after(clone);
|
||||
});
|
||||
}
|
||||
}));
|
||||
directive('child', valueFn({
|
||||
require: '^transclude',
|
||||
link: function(scope, element, attr, ctrl) {
|
||||
capturedTranscludeCtrl = ctrl;
|
||||
}
|
||||
}));
|
||||
});
|
||||
inject(function($compile) {
|
||||
element = $compile('<div transclude><div child></div></div>')($rootScope);
|
||||
expect(capturedTranscludeCtrl).toBeTruthy();
|
||||
});
|
||||
});
|
||||
|
||||
it('should allow access to $transclude in a templateUrl directive', function() {
|
||||
var transclude;
|
||||
module(function() {
|
||||
directive('template', valueFn({
|
||||
templateUrl: 'template.html',
|
||||
replace: true
|
||||
}));
|
||||
directive('transclude', valueFn({
|
||||
transclude: 'content',
|
||||
controller: function($transclude) {
|
||||
transclude = $transclude;
|
||||
}
|
||||
}));
|
||||
});
|
||||
inject(function($compile, $httpBackend) {
|
||||
$httpBackend.expectGET('template.html').respond('<div transclude></div>');
|
||||
element = $compile('<div template></div>')($rootScope);
|
||||
$httpBackend.flush();
|
||||
expect(transclude).toBeDefined();
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
it('should safely create transclude comment node and not break with "-->"',
|
||||
inject(function($rootScope) {
|
||||
|
||||
@@ -28,6 +28,22 @@ describe('ngIf', function () {
|
||||
expect(element.children().length).toBe(1);
|
||||
});
|
||||
|
||||
it('should not add the element twice if the condition goes from true to true', function () {
|
||||
$scope.hello = 'true1';
|
||||
makeIf('hello');
|
||||
expect(element.children().length).toBe(1);
|
||||
$scope.$apply('hello = "true2"');
|
||||
expect(element.children().length).toBe(1);
|
||||
});
|
||||
|
||||
it('should not recreate the element if the condition goes from true to true', function () {
|
||||
$scope.hello = 'true1';
|
||||
makeIf('hello');
|
||||
element.children().data('flag', true);
|
||||
$scope.$apply('hello = "true2"');
|
||||
expect(element.children().data('flag')).toBe(true);
|
||||
});
|
||||
|
||||
it('should create then remove the element if condition changes', function () {
|
||||
$scope.hello = true;
|
||||
makeIf('hello');
|
||||
@@ -132,6 +148,34 @@ describe('ngIf', function () {
|
||||
|
||||
});
|
||||
|
||||
describe('ngIf and transcludes', function() {
|
||||
it('should allow access to directive controller from children when used in a replace template', function() {
|
||||
var controller;
|
||||
module(function($compileProvider) {
|
||||
var directive = $compileProvider.directive;
|
||||
directive('template', valueFn({
|
||||
template: '<div ng-if="true"><span test></span></div>',
|
||||
replace: true,
|
||||
controller: function() {
|
||||
this.flag = true;
|
||||
}
|
||||
}));
|
||||
directive('test', valueFn({
|
||||
require: '^template',
|
||||
link: function(scope, el, attr, ctrl) {
|
||||
controller = ctrl;
|
||||
}
|
||||
}));
|
||||
});
|
||||
inject(function($compile, $rootScope) {
|
||||
var element = $compile('<div><div template></div></div>')($rootScope);
|
||||
$rootScope.$apply();
|
||||
expect(controller.flag).toBe(true);
|
||||
dealoc(element);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('ngIf animations', function () {
|
||||
var body, element, $rootElement;
|
||||
|
||||
|
||||
@@ -439,6 +439,36 @@ describe('ngInclude', function() {
|
||||
});
|
||||
});
|
||||
|
||||
describe('ngInclude and transcludes', function() {
|
||||
it('should allow access to directive controller from children when used in a replace template', function() {
|
||||
var controller;
|
||||
module(function($compileProvider) {
|
||||
var directive = $compileProvider.directive;
|
||||
directive('template', valueFn({
|
||||
template: '<div ng-include="\'include.html\'"></div>',
|
||||
replace: true,
|
||||
controller: function() {
|
||||
this.flag = true;
|
||||
}
|
||||
}));
|
||||
directive('test', valueFn({
|
||||
require: '^template',
|
||||
link: function(scope, el, attr, ctrl) {
|
||||
controller = ctrl;
|
||||
}
|
||||
}));
|
||||
});
|
||||
inject(function($compile, $rootScope, $httpBackend) {
|
||||
$httpBackend.expectGET('include.html').respond('<div><div test></div></div>');
|
||||
var element = $compile('<div><div template></div></div>')($rootScope);
|
||||
$rootScope.$apply();
|
||||
$httpBackend.flush();
|
||||
expect(controller.flag).toBe(true);
|
||||
dealoc(element);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('ngInclude animations', function() {
|
||||
var body, element, $rootElement;
|
||||
|
||||
|
||||
@@ -1058,6 +1058,33 @@ describe('ngRepeat', function() {
|
||||
});
|
||||
});
|
||||
|
||||
describe('ngRepeat and transcludes', function() {
|
||||
it('should allow access to directive controller from children when used in a replace template', function() {
|
||||
var controller;
|
||||
module(function($compileProvider) {
|
||||
var directive = $compileProvider.directive;
|
||||
directive('template', valueFn({
|
||||
template: '<div ng-repeat="l in [1]"><span test></span></div>',
|
||||
replace: true,
|
||||
controller: function() {
|
||||
this.flag = true;
|
||||
}
|
||||
}));
|
||||
directive('test', valueFn({
|
||||
require: '^template',
|
||||
link: function(scope, el, attr, ctrl) {
|
||||
controller = ctrl;
|
||||
}
|
||||
}));
|
||||
});
|
||||
inject(function($compile, $rootScope) {
|
||||
var element = $compile('<div><div template></div></div>')($rootScope);
|
||||
$rootScope.$apply();
|
||||
expect(controller.flag).toBe(true);
|
||||
dealoc(element);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('ngRepeat animations', function() {
|
||||
var body, element, $rootElement;
|
||||
|
||||
@@ -42,7 +42,7 @@ describe('$httpBackend', function() {
|
||||
return {};
|
||||
}),
|
||||
body: {
|
||||
appendChild: jasmine.createSpy('body.appendChid').andCallFake(function(script) {
|
||||
appendChild: jasmine.createSpy('body.appendChild').andCallFake(function(script) {
|
||||
fakeDocument.$$scripts.push(script);
|
||||
}),
|
||||
removeChild: jasmine.createSpy('body.removeChild').andCallFake(function(script) {
|
||||
|
||||
@@ -10,6 +10,56 @@ describe('$location', function() {
|
||||
jqLite(document).off('click');
|
||||
});
|
||||
|
||||
|
||||
describe('File Protocol', function () {
|
||||
var urlParsingNodePlaceholder;
|
||||
|
||||
beforeEach(inject(function ($sniffer) {
|
||||
if ($sniffer.msie) return;
|
||||
|
||||
urlParsingNodePlaceholder = urlParsingNode;
|
||||
|
||||
//temporarily overriding the DOM element
|
||||
//with output from IE, if not in IE
|
||||
urlParsingNode = {
|
||||
hash : "#/C:/",
|
||||
host : "",
|
||||
hostname : "",
|
||||
href : "file:///C:/base#!/C:/foo",
|
||||
pathname : "/C:/foo",
|
||||
port : "",
|
||||
protocol : "file:",
|
||||
search : "",
|
||||
setAttribute: angular.noop
|
||||
};
|
||||
}));
|
||||
|
||||
afterEach(inject(function ($sniffer) {
|
||||
if ($sniffer.msie) return;
|
||||
//reset urlParsingNode
|
||||
urlParsingNode = urlParsingNodePlaceholder;
|
||||
expect(urlParsingNode.pathname).not.toBe('/C:/foo');
|
||||
}));
|
||||
|
||||
|
||||
it('should not include the drive name in path() on WIN', function (){
|
||||
//See issue #4680 for details
|
||||
url = new LocationHashbangUrl('file:///base', '#!');
|
||||
url.$$parse('file:///base#!/foo?a=b&c#hash');
|
||||
|
||||
expect(url.path()).toBe('/foo');
|
||||
});
|
||||
|
||||
|
||||
it('should include the drive name if it was provided in the input url', function () {
|
||||
url = new LocationHashbangUrl('file:///base', '#!');
|
||||
url.$$parse('file:///base#!/C:/foo?a=b&c#hash');
|
||||
|
||||
expect(url.path()).toBe('/C:/foo');
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
describe('NewUrl', function() {
|
||||
beforeEach(function() {
|
||||
url = new LocationHtml5Url('http://www.domain.com:9877/');
|
||||
|
||||
+2
-65
@@ -591,57 +591,6 @@ describe('parser', function() {
|
||||
});
|
||||
|
||||
describe('sandboxing', function() {
|
||||
describe('private members', function() {
|
||||
it('should NOT allow access to private members', function() {
|
||||
forEach(['_name', 'name_', '_', '_name_'], function(name) {
|
||||
function _testExpression(expression) {
|
||||
scope.a = {b: name};
|
||||
scope[name] = {a: scope.a};
|
||||
scope.piece_1 = "XX" + name.charAt(0) + "XX";
|
||||
scope.piece_2 = "XX" + name.substr(1) + "XX";
|
||||
expect(function() {
|
||||
scope.$eval(expression);
|
||||
}).toThrowMinErr(
|
||||
'$parse', 'isecprv', 'Referencing private fields in Angular expressions is disallowed! ' +
|
||||
'Expression: ' + expression);
|
||||
}
|
||||
|
||||
function testExpression(expression) {
|
||||
if (expression.indexOf('"NAME"') != -1) {
|
||||
var concatExpr = 'piece_1.substr(2, 1) + piece_2.substr(2, LEN)'.replace('LEN', name.length-1);
|
||||
_testExpression(expression.replace(/"NAME"/g, concatExpr));
|
||||
_testExpression(expression.replace(/"NAME"/g, '(' + concatExpr + ')'));
|
||||
}
|
||||
_testExpression(expression.replace(/NAME/g, name));
|
||||
}
|
||||
|
||||
// Not all of these are exploitable. The tests ensure that the contract is honored
|
||||
// without caring about the implementation or exploitability.
|
||||
testExpression('NAME'); testExpression('NAME = 1');
|
||||
testExpression('(NAME)'); testExpression('(NAME) = 1');
|
||||
testExpression('a.NAME'); testExpression('a.NAME = 1');
|
||||
testExpression('NAME.b'); testExpression('NAME.b = 1');
|
||||
testExpression('a.NAME.b'); testExpression('a.NAME.b = 1');
|
||||
testExpression('NAME()'); testExpression('NAME() = 1');
|
||||
testExpression('(NAME)()'); testExpression('(NAME = 1)()');
|
||||
testExpression('(NAME).foo()'); testExpression('(NAME = 1).foo()');
|
||||
testExpression('a.NAME()'); testExpression('a.NAME() = 1');
|
||||
testExpression('a.NAME.foo()'); testExpression('a.NAME.foo()');
|
||||
testExpression('foo(NAME)'); testExpression('foo(NAME = 1)');
|
||||
testExpression('foo(a.NAME)'); testExpression('foo(a.NAME = 1)');
|
||||
testExpression('foo(1, a.NAME)'); testExpression('foo(1, a.NAME = 1)');
|
||||
testExpression('foo(a["NAME"])'); testExpression('foo(a["NAME"] = 1)');
|
||||
testExpression('foo(1, a["NAME"])'); testExpression('foo(1, a["NAME"] = 1)');
|
||||
testExpression('foo(b = a["NAME"])'); testExpression('foo(b = (a["NAME"] = 1))');
|
||||
testExpression('a["NAME"]'); testExpression('a["NAME"] = 1');
|
||||
testExpression('a["NAME"]()');
|
||||
testExpression('a["NAME"].foo()');
|
||||
testExpression('a.b["NAME"]'); testExpression('a.b["NAME"] = 1');
|
||||
testExpression('a["b"]["NAME"]'); testExpression('a["b"]["NAME"] = 1');
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('Function constructor', function() {
|
||||
it('should NOT allow access to Function constructor in getter', function() {
|
||||
expect(function() {
|
||||
@@ -702,29 +651,17 @@ describe('parser', function() {
|
||||
expect(function() {
|
||||
scope.$eval('{}.toString["constructor"]["constructor"] = 1');
|
||||
}).toThrowMinErr(
|
||||
'$parse', 'isecfld', 'Referencing "constructor" field in Angular expressions is disallowed! ' +
|
||||
'$parse', 'isecfn', 'Referencing Function in Angular expressions is disallowed! ' +
|
||||
'Expression: {}.toString["constructor"]["constructor"] = 1');
|
||||
|
||||
|
||||
scope.key1 = "const";
|
||||
scope.key2 = "ructor";
|
||||
expect(function() {
|
||||
scope.$eval('{}.toString[key1 + key2].foo');
|
||||
}).toThrowMinErr(
|
||||
'$parse', 'isecfn', 'Referencing Function in Angular expressions is disallowed! ' +
|
||||
'Expression: {}.toString[key1 + key2].foo');
|
||||
|
||||
expect(function() {
|
||||
scope.$eval('{}.toString[key1 + key2] = 1');
|
||||
}).toThrowMinErr(
|
||||
'$parse', 'isecfld', 'Referencing "constructor" field in Angular expressions is disallowed! ' +
|
||||
'Expression: {}.toString[key1 + key2] = 1');
|
||||
|
||||
expect(function() {
|
||||
scope.$eval('{}.toString[key1 + key2].foo = 1');
|
||||
}).toThrowMinErr(
|
||||
'$parse', 'isecfn', 'Referencing Function in Angular expressions is disallowed! ' +
|
||||
'Expression: {}.toString[key1 + key2].foo = 1');
|
||||
'Expression: {}.toString[key1 + key2].foo = 1');
|
||||
|
||||
expect(function() {
|
||||
scope.$eval('{}.toString["constructor"]["a"] = 1');
|
||||
|
||||
@@ -31,6 +31,48 @@ describe("resource", function() {
|
||||
$httpBackend.verifyNoOutstandingExpectation();
|
||||
});
|
||||
|
||||
describe('isValidDottedPath', function() {
|
||||
it('should support arbitrary dotted names', function() {
|
||||
expect(isValidDottedPath('')).toBe(false);
|
||||
expect(isValidDottedPath('1')).toBe(false);
|
||||
expect(isValidDottedPath('1abc')).toBe(false);
|
||||
expect(isValidDottedPath('.')).toBe(false);
|
||||
expect(isValidDottedPath('$')).toBe(true);
|
||||
expect(isValidDottedPath('a')).toBe(true);
|
||||
expect(isValidDottedPath('A')).toBe(true);
|
||||
expect(isValidDottedPath('a1')).toBe(true);
|
||||
expect(isValidDottedPath('$a')).toBe(true);
|
||||
expect(isValidDottedPath('$1')).toBe(true);
|
||||
expect(isValidDottedPath('$$')).toBe(true);
|
||||
expect(isValidDottedPath('$.$')).toBe(true);
|
||||
expect(isValidDottedPath('.$')).toBe(false);
|
||||
expect(isValidDottedPath('$.')).toBe(false);
|
||||
});
|
||||
});
|
||||
|
||||
describe('lookupDottedPath', function() {
|
||||
var data = {a: {b: 'foo', c: null}};
|
||||
|
||||
it('should throw for invalid path', function() {
|
||||
expect(function() {
|
||||
lookupDottedPath(data, '.ckck')
|
||||
}).toThrowMinErr('$resource', 'badmember',
|
||||
'Dotted member path "@.ckck" is invalid.');
|
||||
});
|
||||
|
||||
it('should get dotted paths', function() {
|
||||
expect(lookupDottedPath(data, 'a')).toEqual({b: 'foo', c: null});
|
||||
expect(lookupDottedPath(data, 'a.b')).toBe('foo');
|
||||
expect(lookupDottedPath(data, 'a.c')).toBeNull();
|
||||
});
|
||||
|
||||
it('should skip over null/undefined members', function() {
|
||||
expect(lookupDottedPath(data, 'a.b.c')).toBe(undefined);
|
||||
expect(lookupDottedPath(data, 'a.c.c')).toBe(undefined);
|
||||
expect(lookupDottedPath(data, 'a.b.c.d')).toBe(undefined);
|
||||
expect(lookupDottedPath(data, 'NOT_EXIST')).toBe(undefined);
|
||||
});
|
||||
});
|
||||
|
||||
it('should not include a request body when calling $delete', function() {
|
||||
$httpBackend.expect('DELETE', '/fooresource', null).respond({});
|
||||
@@ -189,6 +231,19 @@ describe("resource", function() {
|
||||
});
|
||||
|
||||
|
||||
it('should support @_property lookups with underscores', function() {
|
||||
$httpBackend.expect('GET', '/Order/123').respond({_id: {_key:'123'}, count: 0});
|
||||
var LineItem = $resource('/Order/:_id', {_id: '@_id._key'});
|
||||
var item = LineItem.get({_id: 123});
|
||||
$httpBackend.flush();
|
||||
expect(item).toEqualData({_id: {_key: '123'}, count: 0});
|
||||
$httpBackend.expect('POST', '/Order/123').respond({_id: {_key:'123'}, count: 1});
|
||||
item.$save();
|
||||
$httpBackend.flush();
|
||||
expect(item).toEqualData({_id: {_key: '123'}, count: 1});
|
||||
});
|
||||
|
||||
|
||||
it('should not pass default params between actions', function() {
|
||||
var R = $resource('/Path', {}, {get: {method: 'GET', params: {objId: '1'}}, perform: {method: 'GET'}});
|
||||
|
||||
|
||||
@@ -514,6 +514,44 @@ describe('ngView', function() {
|
||||
});
|
||||
});
|
||||
|
||||
describe('ngView and transcludes', function() {
|
||||
it('should allow access to directive controller from children when used in a replace template', function() {
|
||||
var controller;
|
||||
module('ngRoute');
|
||||
module(function($compileProvider, $routeProvider) {
|
||||
$routeProvider.when('/view', {templateUrl: 'view.html'});
|
||||
var directive = $compileProvider.directive;
|
||||
directive('template', function() {
|
||||
return {
|
||||
template: '<div ng-view></div>',
|
||||
replace: true,
|
||||
controller: function() {
|
||||
this.flag = true;
|
||||
}
|
||||
};
|
||||
});
|
||||
|
||||
directive('test', function() {
|
||||
return {
|
||||
require: '^template',
|
||||
link: function(scope, el, attr, ctrl) {
|
||||
controller = ctrl;
|
||||
}
|
||||
};
|
||||
});
|
||||
});
|
||||
inject(function($compile, $rootScope, $httpBackend, $location) {
|
||||
$httpBackend.expectGET('view.html').respond('<div><div test></div></div>');
|
||||
var element = $compile('<div><div template></div></div>')($rootScope);
|
||||
$location.url('/view');
|
||||
$rootScope.$apply();
|
||||
$httpBackend.flush();
|
||||
expect(controller.flag).toBe(true);
|
||||
dealoc(element);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('ngView animations', function() {
|
||||
var body, element, $rootElement;
|
||||
|
||||
|
||||
Reference in New Issue
Block a user