Skip to content

T
todomvc
Commit 67072a72 authored by Pascal Hartig's avatar Pascal Hartig
Browse files
Options

AngularJS: Upgrade to 1.2.20

parent c8c70e41
Hide whitespace changes
Inline Side-by-side
Showing with 509 additions and 465 deletions
architecture-examples/angularjs/bower.json
View file @ 67072a72
......@@ -2,11 +2,11 @@
"name": "todomvc-angular",
"version": "0.0.0",
"dependencies": {
"angular": "1.2.19",
"angular": "1.2.20",
"todomvc-common": "~0.1.4"
},
"devDependencies": {
"angular-mocks": "1.2.19",
"angular-route": "1.2.19"
"angular-mocks": "1.2.20",
"angular-route": "1.2.20"
}
}
architecture-examples/angularjs/bower_components/angular-route/angular-route.js
View file @ 67072a72
/**
* @license AngularJS v1.2.19
* @license AngularJS v1.2.20
* (c) 2010-2014 Google, Inc. http://angularjs.org
* License: MIT
*/
......
architecture-examples/angularjs/bower_components/angular/angular.js
View file @ 67072a72
/**
* @license AngularJS v1.2.19
* @license AngularJS v1.2.20
* (c) 2010-2014 Google, Inc. http://angularjs.org
* License: MIT
*/
......@@ -68,7 +68,7 @@ function minErr(module) {
return match;
});
message = message + '\nhttp://errors.angularjs.org/1.2.19/' +
message = message + '\nhttp://errors.angularjs.org/1.2.20/' +
(module ? module + '/' : '') + code;
for (i = 2; i < arguments.length; i++) {
message = message + (i == 2 ? '?' : '&') + 'p' + (i-2) + '=' +
......@@ -810,9 +810,9 @@ function isLeafNode (node) {
* @returns {*} The copy or updated `destination`, if `destination` was specified.
*
* @example
<example>
<example module="copyExample">
<file name="index.html">
<div ng-controller="Controller">
<div ng-controller="ExampleController">
<form novalidate class="simple-form">
Name: <input type="text" ng-model="user.name" /><br />
E-mail: <input type="email" ng-model="user.email" /><br />
......@@ -826,21 +826,22 @@ function isLeafNode (node) {
</div>
<script>
function Controller($scope) {
$scope.master= {};
angular.module('copyExample')
.controller('ExampleController', ['$scope', function($scope) {
$scope.master= {};
$scope.update = function(user) {
// Example with 1 argument
$scope.master= angular.copy(user);
};
$scope.update = function(user) {
// Example with 1 argument
$scope.master= angular.copy(user);
};
$scope.reset = function() {
// Example with 2 arguments
angular.copy($scope.master, $scope.user);
};
$scope.reset = function() {
// Example with 2 arguments
angular.copy($scope.master, $scope.user);
};
$scope.reset();
}
$scope.reset();
}]);
</script>
</file>
</example>
......@@ -1184,7 +1185,7 @@ function parseKeyValue(/**string*/keyValue) {
key = tryDecodeURIComponent(key_value[0]);
if ( isDefined(key) ) {
var val = isDefined(key_value[1]) ? tryDecodeURIComponent(key_value[1]) : true;
if (!obj[key]) {
if (!hasOwnProperty.call(obj, key)) {
obj[key] = val;
} else if(isArray(obj[key])) {
obj[key].push(val);
......@@ -1958,11 +1959,11 @@ function setupModuleLoader(window) {
* - `codeName` – `{string}` – Code name of the release, such as "jiggling-armfat".
*/
var version = {
full: '1.2.19', // all of these placeholder strings will be replaced by grunt's
full: '1.2.20', // all of these placeholder strings will be replaced by grunt's
major: 1, // package task
minor: 2,
dot: 19,
codeName: 'precognitive-flashbacks'
dot: 20,
codeName: 'accidental-beautification'
};
......@@ -5241,7 +5242,7 @@ function $TemplateCacheProvider() {
* local name. Given `<widget my-attr="count = count + value">` and widget definition of
* `scope: { localFn:'&myAttr' }`, then isolate scope property `localFn` will point to
* a function wrapper for the `count = count + value` expression. Often it's desirable to
* pass data from the isolated scope via an expression and to the parent scope, this can be
* pass data from the isolated scope via an expression to the parent scope, this can be
* done by passing a map of local variable names and values into the expression wrapper fn.
* For example, if the expression is `increment(amount)` then we can specify the amount value
* by calling the `localFn` as `localFn({amount: 22})`.
......@@ -5468,10 +5469,10 @@ function $TemplateCacheProvider() {
* to illustrate how `$compile` works.
* </div>
*
<example module="compile">
<example module="compileExample">
<file name="index.html">
<script>
angular.module('compile', [], function($compileProvider) {
angular.module('compileExample', [], function($compileProvider) {
// configure new 'compile' directive by passing a directive
// factory function. The factory function injects the '$compile'
$compileProvider.directive('compile', function($compile) {
......@@ -5495,15 +5496,14 @@ function $TemplateCacheProvider() {
}
);
};
})
});
function Ctrl($scope) {
});
})
.controller('GreeterController', ['$scope', function($scope) {
$scope.name = 'Angular';
$scope.html = 'Hello {{name}}';
}
}]);
</script>
<div ng-controller="Ctrl">
<div ng-controller="GreeterController">
<input ng-model="name"> <br>
<textarea ng-model="html"></textarea> <br>
<div compile="html"></div>
......@@ -7239,18 +7239,19 @@ function $ControllerProvider() {
* A {@link angular.element jQuery or jqLite} wrapper for the browser's `window.document` object.
*
* @example
<example>
<example module="documentExample">
<file name="index.html">
<div ng-controller="MainCtrl">
<div ng-controller="ExampleController">
<p>$document title: <b ng-bind="title"></b></p>
<p>window.document title: <b ng-bind="windowTitle"></b></p>
</div>
</file>
<file name="script.js">
function MainCtrl($scope, $document) {
$scope.title = $document[0].title;
$scope.windowTitle = angular.element(window.document)[0].title;
}
angular.module('documentExample', [])
.controller('ExampleController', ['$scope', '$document', function($scope, $document) {
$scope.title = $document[0].title;
$scope.windowTitle = angular.element(window.document)[0].title;
}]);
</file>
</example>
*/
......@@ -7383,12 +7384,39 @@ function isSuccess(status) {
}
/**
* @ngdoc provider
* @name $httpProvider
* @description
* Use `$httpProvider` to change the default behavior of the {@link ng.$http $http} service.
* */
function $HttpProvider() {
var JSON_START = /^\s*(\[|\{[^\{])/,
JSON_END = /[\}\]]\s*$/,
PROTECTION_PREFIX = /^\)\]\}',?\n/,
CONTENT_TYPE_APPLICATION_JSON = {'Content-Type': 'application/json;charset=utf-8'};
/**
* @ngdoc property
* @name $httpProvider#defaults
* @description
*
* Object containing default values for all {@link ng.$http $http} requests.
*
* - **`defaults.xsrfCookieName`** - {string} - Name of cookie containing the XSRF token.
* Defaults value is `'XSRF-TOKEN'`.
*
* - **`defaults.xsrfHeaderName`** - {string} - Name of HTTP header to populate with the
* XSRF token. Defaults value is `'X-XSRF-TOKEN'`.
*
* - **`defaults.headers`** - {Object} - Default headers for all $http requests.
* Refer to {@link ng.$http#setting-http-headers $http} for documentation on
* setting default headers.
* - **`defaults.headers.common`**
* - **`defaults.headers.post`**
* - **`defaults.headers.put`**
* - **`defaults.headers.patch`**
**/
var defaults = this.defaults = {
// transform incoming response data
transformResponse: [function(data) {
......@@ -7878,9 +7906,9 @@ function $HttpProvider() {
*
*
* @example
<example>
<example module="httpExample">
<file name="index.html">
<div ng-controller="FetchCtrl">
<div ng-controller="FetchController">
<select ng-model="method">
<option>GET</option>
<option>JSONP</option>
......@@ -7902,30 +7930,32 @@ function $HttpProvider() {
</div>
</file>
<file name="script.js">
function FetchCtrl($scope, $http, $templateCache) {
$scope.method = 'GET';
$scope.url = 'http-hello.html';
$scope.fetch = function() {
$scope.code = null;
$scope.response = null;
$http({method: $scope.method, url: $scope.url, cache: $templateCache}).
success(function(data, status) {
$scope.status = status;
$scope.data = data;
}).
error(function(data, status) {
$scope.data = data || "Request failed";
$scope.status = status;
});
};
angular.module('httpExample', [])
.controller('FetchController', ['$scope', '$http', '$templateCache',
function($scope, $http, $templateCache) {
$scope.method = 'GET';
$scope.url = 'http-hello.html';
$scope.fetch = function() {
$scope.code = null;
$scope.response = null;
$http({method: $scope.method, url: $scope.url, cache: $templateCache}).
success(function(data, status) {
$scope.status = status;
$scope.data = data;
}).
error(function(data, status) {
$scope.data = data || "Request failed";
$scope.status = status;
});
};
$scope.updateModel = function(method, url) {
$scope.method = method;
$scope.url = url;
};
}
$scope.updateModel = function(method, url) {
$scope.method = method;
$scope.url = url;
};
}]);
</file>
<file name="http-hello.html">
Hello, $http!
......@@ -7979,7 +8009,7 @@ function $HttpProvider() {
var reqData = transformData(config.data, headersGetter(headers), config.transformRequest);
// strip content-type if data is undefined
if (isUndefined(config.data)) {
if (isUndefined(reqData)) {
forEach(headers, function(value, header) {
if (lowercase(header) === 'content-type') {
delete headers[header];
......@@ -8048,10 +8078,6 @@ function $HttpProvider() {
defHeaders = extend({}, defHeaders.common, defHeaders[lowercase(config.method)]);
// execute if header value is function
execHeaders(defHeaders);
execHeaders(reqHeaders);
// using for-in instead of forEach to avoid unecessary iteration after header has been found
defaultHeadersIteration:
for (defHeaderName in defHeaders) {
......@@ -8066,6 +8092,8 @@ function $HttpProvider() {
reqHeaders[defHeaderName] = defHeaders[defHeaderName];
}
// execute if header value is a function for merged headers
execHeaders(reqHeaders);
return reqHeaders;
function execHeaders(headers) {
......@@ -8841,25 +8869,27 @@ function $IntervalProvider() {
* @returns {promise} A promise which will be notified on each iteration.
*
* @example
* <example module="time">
* <file name="index.html">
* <script>
* function Ctrl2($scope,$interval) {
* $scope.format = 'M/d/yy h:mm:ss a';
* $scope.blood_1 = 100;
* $scope.blood_2 = 120;
* <example module="intervalExample">
* <file name="index.html">
* <script>
* angular.module('intervalExample', [])
* .controller('ExampleController', ['$scope', '$interval',
* function($scope, $interval) {
* $scope.format = 'M/d/yy h:mm:ss a';
* $scope.blood_1 = 100;
* $scope.blood_2 = 120;
*
* var stop;
* $scope.fight = function() {
* // Don't start a new fight if we are already fighting
* if ( angular.isDefined(stop) ) return;
* var stop;
* $scope.fight = function() {
* // Don't start a new fight if we are already fighting
* if ( angular.isDefined(stop) ) return;
*
* stop = $interval(function() {
* if ($scope.blood_1 > 0 && $scope.blood_2 > 0) {
* $scope.blood_1 = $scope.blood_1 - 3;
* $scope.blood_2 = $scope.blood_2 - 4;
* $scope.blood_1 = $scope.blood_1 - 3;
* $scope.blood_2 = $scope.blood_2 - 4;
* } else {
* $scope.stopFight();
* $scope.stopFight();
* }
* }, 100);
* };
......@@ -8874,22 +8904,21 @@ function $IntervalProvider() {
* $scope.resetFight = function() {
* $scope.blood_1 = 100;
* $scope.blood_2 = 120;
* }
* };
*
* $scope.$on('$destroy', function() {
* // Make sure that the interval is destroyed too
* // Make sure that the interval nis destroyed too
* $scope.stopFight();
* });
* }
*
* angular.module('time', [])
* // Register the 'myCurrentTime' directive factory method.
* // We inject $interval and dateFilter service since the factory method is DI.
* .directive('myCurrentTime', function($interval, dateFilter) {
* })
* // Register the 'myCurrentTime' directive factory method.
* // We inject $interval and dateFilter service since the factory method is DI.
* .directive('myCurrentTime', ['$interval', 'dateFilter',
* function($interval, dateFilter) {
* // return the directive link function. (compile function not needed)
* return function(scope, element, attrs) {
* var format, // date format
* stopTime; // so that we can cancel the time updates
* stopTime; // so that we can cancel the time updates
*
* // used to update the UI
* function updateTime() {
......@@ -8905,28 +8934,28 @@ function $IntervalProvider() {
* stopTime = $interval(updateTime, 1000);
*
* // listen on DOM destroy (removal) event, and cancel the next UI update
* // to prevent updating time ofter the DOM element was removed.
* // to prevent updating time after the DOM element was removed.
* element.bind('$destroy', function() {
* $interval.cancel(stopTime);
* });
* }
* });
* </script>
* </script>
*
* <div>
* <div ng-controller="Ctrl2">
* Date format: <input ng-model="format"> <hr/>
* Current time is: <span my-current-time="format"></span>
* <hr/>
* Blood 1 : <font color='red'>{{blood_1}}</font>
* Blood 2 : <font color='red'>{{blood_2}}</font>
* <button type="button" data-ng-click="fight()">Fight</button>
* <button type="button" data-ng-click="stopFight()">StopFight</button>
* <button type="button" data-ng-click="resetFight()">resetFight</button>
* </div>
* <div>
* <div ng-controller="ExampleController">
* Date format: <input ng-model="format"> <hr/>
* Current time is: <span my-current-time="format"></span>
* <hr/>
* Blood 1 : <font color='red'>{{blood_1}}</font>
* Blood 2 : <font color='red'>{{blood_2}}</font>
* <button type="button" data-ng-click="fight()">Fight</button>
* <button type="button" data-ng-click="stopFight()">StopFight</button>
* <button type="button" data-ng-click="resetFight()">resetFight</button>
* </div>
* </div>
*
* </file>
* </file>
* </example>
*/
function interval(fn, delay, count, invokeApply) {
......@@ -9483,14 +9512,17 @@ LocationHashbangInHtml5Url.prototype =
* If the argument is a hash object containing an array of values, these values will be encoded
* as duplicate search parameters in the url.
*
* @param {(string|Array<string>)=} paramValue If `search` is a string, then `paramValue` will
* override only a single search property.
* @param {(string|Array<string>|boolean)=} paramValue If `search` is a string, then `paramValue`
* will override only a single search property.
*
* If `paramValue` is an array, it will override the property of the `search` component of
* `$location` specified via the first argument.
*
* If `paramValue` is `null`, the property specified via the first argument will be deleted.
*
* If `paramValue` is `true`, the property specified via the first argument will be added with no
* value nor trailing equal sign.
*
* @return {Object} If called with no arguments returns the parsed `search` object. If called with
* one or more arguments returns `$location` object itself.
*/
......@@ -9502,6 +9534,11 @@ LocationHashbangInHtml5Url.prototype =
if (isString(search)) {
this.$$search = parseKeyValue(search);
} else if (isObject(search)) {
// remove object undefined or null properties
forEach(search, function(value, key) {
if (value == null) delete search[key];
});
this.$$search = search;
} else {
throw $locationMinErr('isrcharg',
......@@ -9823,15 +9860,16 @@ function $LocationProvider(){
* {@link ng.$logProvider ng.$logProvider#debugEnabled} to change this.
*
* @example
<example>
<example module="logExample">
<file name="script.js">
function LogCtrl($scope, $log) {
$scope.$log = $log;
$scope.message = 'Hello World!';
}
angular.module('logExample', [])
.controller('LogController', ['$scope', '$log', function($scope, $log) {
$scope.$log = $log;
$scope.message = 'Hello World!';
}]);
</file>
<file name="index.html">
<div ng-controller="LogCtrl">
<div ng-controller="LogController">
<p>Reload this page with open console, enter text and hit the log button...</p>
Message:
<input type="text" ng-model="message"/>
......@@ -9855,7 +9893,7 @@ function $LogProvider(){
self = this;
/**
* @ngdoc property
* @ngdoc method
* @name $logProvider#debugEnabled
* @description
* @param {boolean=} flag enable or disable debug level messages
......@@ -10954,26 +10992,6 @@ function cspSafeGetterFn(key0, key1, key2, key3, key4, fullExp, options) {
};
}
function simpleGetterFn1(key0, fullExp) {
ensureSafeMemberName(key0, fullExp);
return function simpleGetterFn1(scope, locals) {
if (scope == null) return undefined;
return ((locals && locals.hasOwnProperty(key0)) ? locals : scope)[key0];
};
}
function simpleGetterFn2(key0, key1, fullExp) {
ensureSafeMemberName(key0, fullExp);
ensureSafeMemberName(key1, fullExp);
return function simpleGetterFn2(scope, locals) {
if (scope == null) return undefined;
scope = ((locals && locals.hasOwnProperty(key0)) ? locals : scope)[key0];
return scope == null ? undefined : scope[key1];
};
}
function getterFn(path, options, fullExp) {
// Check whether the cache has this getter already.
// We can use hasOwnProperty directly on the cache because we ensure,
......@@ -10986,13 +11004,8 @@ function getterFn(path, options, fullExp) {
pathKeysLength = pathKeys.length,
fn;
// When we have only 1 or 2 tokens, use optimized special case closures.
// http://jsperf.com/angularjs-parse-getter/6
if (!options.unwrapPromises && pathKeysLength === 1) {
fn = simpleGetterFn1(pathKeys[0], fullExp);
} else if (!options.unwrapPromises && pathKeysLength === 2) {
fn = simpleGetterFn2(pathKeys[0], pathKeys[1], fullExp);
} else if (options.csp) {
if (options.csp) {
if (pathKeysLength < 6) {
fn = cspSafeGetterFn(pathKeys[0], pathKeys[1], pathKeys[2], pathKeys[3], pathKeys[4], fullExp,
options);
......@@ -13119,19 +13132,21 @@ function adjustMatchers(matchers) {
*
* Here is what a secure configuration for this scenario might look like:
*
* <pre class="prettyprint">
* angular.module('myApp', []).config(function($sceDelegateProvider) {
* $sceDelegateProvider.resourceUrlWhitelist([
* // Allow same origin resource loads.
* 'self',
* // Allow loading from our assets domain. Notice the difference between * and **.
* 'http://srv*.assets.example.com/**']);
*
* // The blacklist overrides the whitelist so the open redirect here is blocked.
* $sceDelegateProvider.resourceUrlBlacklist([
* 'http://myapp.example.com/clickThru**']);
* });
* </pre>
* ```
* angular.module('myApp', []).config(function($sceDelegateProvider) {
* $sceDelegateProvider.resourceUrlWhitelist([
* // Allow same origin resource loads.
* 'self',
* // Allow loading from our assets domain. Notice the difference between * and **.
* 'http://srv*.assets.example.com/**'
* ]);
*
* // The blacklist overrides the whitelist so the open redirect here is blocked.
* $sceDelegateProvider.resourceUrlBlacklist([
* 'http://myapp.example.com/clickThru**'
* ]);
* });
* ```
*/
function $SceDelegateProvider() {
......@@ -13426,10 +13441,10 @@ function $SceDelegateProvider() {
*
* Here's an example of a binding in a privileged context:
*
* <pre class="prettyprint">
* <input ng-model="userHtml">
* <div ng-bind-html="userHtml">
* </pre>
* ```
* <input ng-model="userHtml">
* <div ng-bind-html="userHtml"></div>
* ```
*
* 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.
......@@ -13469,15 +13484,15 @@ function $SceDelegateProvider() {
* ng.$sce#parseAsHtml $sce.parseAsHtml(binding expression)}. Here's the actual code (slightly
* simplified):
*
* <pre class="prettyprint">
* var ngBindHtmlDirective = ['$sce', function($sce) {
* return function(scope, element, attr) {
* scope.$watch($sce.parseAsHtml(attr.ngBindHtml), function(value) {
* element.html(value || '');
* });
* };
* }];
* </pre>
* ```
* var ngBindHtmlDirective = ['$sce', function($sce) {
* return function(scope, element, attr) {
* scope.$watch($sce.parseAsHtml(attr.ngBindHtml), function(value) {
* element.html(value || '');
* });
* };
* }];
* ```
*
* ## Impact on loading templates
*
......@@ -13581,66 +13596,65 @@ function $SceDelegateProvider() {
*
* ## Show me an example using SCE.
*
* @example
<example module="mySceApp" deps="angular-sanitize.js">
<file name="index.html">
<div ng-controller="myAppController as myCtrl">
<i ng-bind-html="myCtrl.explicitlyTrustedHtml" id="explicitlyTrustedHtml"></i><br><br>
<b>User comments</b><br>
By default, HTML that isn't explicitly trusted (e.g. Alice's comment) is sanitized when
$sanitize is available. If $sanitize isn't available, this results in an error instead of an
exploit.
<div class="well">
<div ng-repeat="userComment in myCtrl.userComments">
<b>{{userComment.name}}</b>:
<span ng-bind-html="userComment.htmlComment" class="htmlComment"></span>
<br>
</div>
</div>
</div>
</file>
<file name="script.js">
var mySceApp = angular.module('mySceApp', ['ngSanitize']);
mySceApp.controller("myAppController", function myAppController($http, $templateCache, $sce) {
var self = this;
$http.get("test_data.json", {cache: $templateCache}).success(function(userComments) {
self.userComments = userComments;
});
self.explicitlyTrustedHtml = $sce.trustAsHtml(
'<span onmouseover="this.textContent=&quot;Explicitly trusted HTML bypasses ' +
'sanitization.&quot;">Hover over this text.</span>');
});
</file>
<file name="test_data.json">
[
{ "name": "Alice",
"htmlComment":
"<span onmouseover='this.textContent=\"PWN3D!\"'>Is <i>anyone</i> reading this?</span>"
},
{ "name": "Bob",
"htmlComment": "<i>Yes!</i> Am I the only other one?"
}
]
</file>
<file name="protractor.js" type="protractor">
describe('SCE doc demo', function() {
it('should sanitize untrusted values', function() {
expect(element(by.css('.htmlComment')).getInnerHtml())
.toBe('<span>Is <i>anyone</i> reading this?</span>');
});
it('should NOT sanitize explicitly trusted values', function() {
expect(element(by.id('explicitlyTrustedHtml')).getInnerHtml()).toBe(
'<span onmouseover="this.textContent=&quot;Explicitly trusted HTML bypasses ' +
'sanitization.&quot;">Hover over this text.</span>');
});
});
</file>
</example>
* <example module="mySceApp" deps="angular-sanitize.js">
* <file name="index.html">
* <div ng-controller="myAppController as myCtrl">
* <i ng-bind-html="myCtrl.explicitlyTrustedHtml" id="explicitlyTrustedHtml"></i><br><br>
* <b>User comments</b><br>
* By default, HTML that isn't explicitly trusted (e.g. Alice's comment) is sanitized when
* $sanitize is available. If $sanitize isn't available, this results in an error instead of an
* exploit.
* <div class="well">
* <div ng-repeat="userComment in myCtrl.userComments">
* <b>{{userComment.name}}</b>:
* <span ng-bind-html="userComment.htmlComment" class="htmlComment"></span>
* <br>
* </div>
* </div>
* </div>
* </file>
*
* <file name="script.js">
* var mySceApp = angular.module('mySceApp', ['ngSanitize']);
*
* mySceApp.controller("myAppController", function myAppController($http, $templateCache, $sce) {
* var self = this;
* $http.get("test_data.json", {cache: $templateCache}).success(function(userComments) {
* self.userComments = userComments;
* });
* self.explicitlyTrustedHtml = $sce.trustAsHtml(
* '<span onmouseover="this.textContent=&quot;Explicitly trusted HTML bypasses ' +
* 'sanitization.&quot;">Hover over this text.</span>');
* });
* </file>
*
* <file name="test_data.json">
* [
* { "name": "Alice",
* "htmlComment":
* "<span onmouseover='this.textContent=\"PWN3D!\"'>Is <i>anyone</i> reading this?</span>"
* },
* { "name": "Bob",
* "htmlComment": "<i>Yes!</i> Am I the only other one?"
* }
* ]
* </file>
*
* <file name="protractor.js" type="protractor">
* describe('SCE doc demo', function() {
* it('should sanitize untrusted values', function() {
* expect(element.all(by.css('.htmlComment')).first().getInnerHtml())
* .toBe('<span>Is <i>anyone</i> reading this?</span>');
* });
*
* it('should NOT sanitize explicitly trusted values', function() {
* expect(element(by.id('explicitlyTrustedHtml')).getInnerHtml()).toBe(
* '<span onmouseover="this.textContent=&quot;Explicitly trusted HTML bypasses ' +
* 'sanitization.&quot;">Hover over this text.</span>');
* });
* });
* </file>
* </example>
*
*
*
......@@ -13654,13 +13668,13 @@ function $SceDelegateProvider() {
*
* That said, here's how you can completely disable SCE:
*
* <pre class="prettyprint">
* angular.module('myAppWithSceDisabledmyApp', []).config(function($sceProvider) {
* // Completely disable SCE. For demonstration purposes only!
* // Do not use in new projects.
* $sceProvider.enabled(false);
* });
* </pre>
* ```
* angular.module('myAppWithSceDisabledmyApp', []).config(function($sceProvider) {
* // Completely disable SCE. For demonstration purposes only!
* // Do not use in new projects.
* $sceProvider.enabled(false);
* });
* ```
*
*/
/* jshint maxlen: 100 */
......@@ -14357,17 +14371,18 @@ function urlIsSameOrigin(requestUrl) {
* expression.
*
* @example
<example>
<example module="windowExample">
<file name="index.html">
<script>
function Ctrl($scope, $window) {
$scope.greeting = 'Hello, World!';
$scope.doGreeting = function(greeting) {
angular.module('windowExample', [])
.controller('ExampleController', ['$scope', '$window', function ($scope, $window) {
$scope.greeting = 'Hello, World!';
$scope.doGreeting = function(greeting) {
$window.alert(greeting);
};
}
};
}]);
</script>
<div ng-controller="Ctrl">
<div ng-controller="ExampleController">
<input type="text" ng-model="greeting" />
<button ng-click="doGreeting(greeting)">ALERT</button>
</div>
......@@ -14766,14 +14781,15 @@ function filterFilter() {
*
*
* @example
<example>
<example module="currencyExample">
<file name="index.html">
<script>
function Ctrl($scope) {
$scope.amount = 1234.56;
}
angular.module('currencyExample', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.amount = 1234.56;
}]);
</script>
<div ng-controller="Ctrl">
<div ng-controller="ExampleController">
<input type="number" ng-model="amount"> <br>
default currency symbol ($): <span id="currency-default">{{amount | currency}}</span><br>
custom currency identifier (USD$): <span>{{amount | currency:"USD$"}}</span>
......@@ -14825,14 +14841,15 @@ function currencyFilter($locale) {
* @returns {string} Number rounded to decimalPlaces and places a “,” after each third digit.
*
* @example
<example>
<example module="numberFilterExample">
<file name="index.html">
<script>
function Ctrl($scope) {
$scope.val = 1234.56789;
}
angular.module('numberFilterExample', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.val = 1234.56789;
}]);
</script>
<div ng-controller="Ctrl">
<div ng-controller="ExampleController">
Enter number: <input ng-model='val'><br>
Default formatting: <span id='number-default'>{{val | number}}</span><br>
No fractions: <span>{{val | number:0}}</span><br>
......@@ -15256,17 +15273,18 @@ var uppercaseFilter = valueFn(uppercase);
* had less than `limit` elements.
*
* @example
<example>
<example module="limitToExample">
<file name="index.html">
<script>
function Ctrl($scope) {
$scope.numbers = [1,2,3,4,5,6,7,8,9];
$scope.letters = "abcdefghi";
$scope.numLimit = 3;
$scope.letterLimit = 3;
}
angular.module('limitToExample', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.numbers = [1,2,3,4,5,6,7,8,9];
$scope.letters = "abcdefghi";
$scope.numLimit = 3;
$scope.letterLimit = 3;
}]);
</script>
<div ng-controller="Ctrl">
<div ng-controller="ExampleController">
Limit {{numbers}} to: <input type="integer" ng-model="numLimit">
<p>Output numbers: {{ numbers | limitTo:numLimit }}</p>
Limit {{letters}} to: <input type="integer" ng-model="letterLimit">
......@@ -15378,20 +15396,21 @@ function limitToFilter(){
* @returns {Array} Sorted copy of the source array.
*
* @example
<example>
<example module="orderByExample">
<file name="index.html">
<script>
function Ctrl($scope) {
$scope.friends =
[{name:'John', phone:'555-1212', age:10},
{name:'Mary', phone:'555-9876', age:19},
{name:'Mike', phone:'555-4321', age:21},
{name:'Adam', phone:'555-5678', age:35},
{name:'Julie', phone:'555-8765', age:29}]
$scope.predicate = '-age';
}
angular.module('orderByExample', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.friends =
[{name:'John', phone:'555-1212', age:10},
{name:'Mary', phone:'555-9876', age:19},
{name:'Mike', phone:'555-4321', age:21},
{name:'Adam', phone:'555-5678', age:35},
{name:'Julie', phone:'555-8765', age:29}];
$scope.predicate = '-age';
}]);
</script>
<div ng-controller="Ctrl">
<div ng-controller="ExampleController">
<pre>Sorting predicate = {{predicate}}; reverse = {{reverse}}</pre>
<hr/>
[ <a href="" ng-click="predicate=''">unsorted</a> ]
......@@ -15419,7 +15438,7 @@ function limitToFilter(){
* Example:
*
* @example
<example>
<example module="orderByExample">
<file name="index.html">
<div ng-controller="Ctrl">
<table class="friend">
......@@ -15439,21 +15458,21 @@ function limitToFilter(){
</file>
<file name="script.js">
function Ctrl($scope, $filter) {
var orderBy = $filter('orderBy');
$scope.friends = [
{ name: 'John', phone: '555-1212', age: 10 },
{ name: 'Mary', phone: '555-9876', age: 19 },
{ name: 'Mike', phone: '555-4321', age: 21 },
{ name: 'Adam', phone: '555-5678', age: 35 },
{ name: 'Julie', phone: '555-8765', age: 29 }
];
$scope.order = function(predicate, reverse) {
$scope.friends = orderBy($scope.friends, predicate, reverse);
};
$scope.order('-age',false);
}
angular.module('orderByExample', [])
.controller('ExampleController', ['$scope', '$filter', function($scope, $filter) {
var orderBy = $filter('orderBy');
$scope.friends = [
{ name: 'John', phone: '555-1212', age: 10 },
{ name: 'Mary', phone: '555-9876', age: 19 },
{ name: 'Mike', phone: '555-4321', age: 21 },
{ name: 'Adam', phone: '555-5678', age: 35 },
{ name: 'Julie', phone: '555-8765', age: 29 }
];
$scope.order = function(predicate, reverse) {
$scope.friends = orderBy($scope.friends, predicate, reverse);
};
$scope.order('-age',false);
}]);
</file>
</example>
*/
......@@ -15639,7 +15658,7 @@ var htmlAnchorDirective = valueFn({
return browser.driver.getCurrentUrl().then(function(url) {
return url.match(/\/123$/);
});
}, 1000, 'page should navigate to /123');
}, 5000, 'page should navigate to /123');
});
xit('should execute ng-click but not reload when href empty string and name specified', function() {
......@@ -15667,7 +15686,7 @@ var htmlAnchorDirective = valueFn({
return browser.driver.getCurrentUrl().then(function(url) {
return url.match(/\/6$/);
});
}, 1000, 'page should navigate to /6');
}, 5000, 'page should navigate to /6');
});
</file>
</example>
......@@ -16283,12 +16302,13 @@ function FormController(element, attrs, $scope, $animate) {
* </pre>
*
* @example
<example deps="angular-animate.js" animations="true" fixBase="true">
<example deps="angular-animate.js" animations="true" fixBase="true" module="formExample">
<file name="index.html">
<script>
function Ctrl($scope) {
$scope.userType = 'guest';
}
angular.module('formExample', [])
.controller('FormController', ['$scope', function($scope) {
$scope.userType = 'guest';
}]);
</script>
<style>
.my-form {
......@@ -16300,7 +16320,7 @@ function FormController(element, attrs, $scope, $animate) {
background: red;
}
</style>
<form name="myForm" ng-controller="Ctrl" class="my-form">
<form name="myForm" ng-controller="FormController" class="my-form">
userType: <input name="input" ng-model="userType" required>
<span class="error" ng-show="myForm.input.$error.required">Required!</span><br>
<tt>userType = {{userType}}</tt><br>
......@@ -16403,7 +16423,7 @@ var ngFormDirective = formDirectiveFactory(true);
*/
var URL_REGEXP = /^(ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?$/;
var EMAIL_REGEXP = /^[a-z0-9!#$%&'*+\/=?^_`{|}~.-]+@[a-z0-9-]+(\.[a-z0-9-]+)*$/i;
var EMAIL_REGEXP = /^[a-z0-9!#$%&'*+\/=?^_`{|}~.-]+@[a-z0-9]([a-z0-9-]*[a-z0-9])?(\.[a-z0-9]([a-z0-9-]*[a-z0-9])?)*$/i;
var NUMBER_REGEXP = /^\s*(\-|\+)?(\d+|(\d*(\.\d*)))\s*$/;
var inputType = {
......@@ -16433,15 +16453,16 @@ var inputType = {
* @param {boolean=} [ngTrim=true] If set to false Angular will not automatically trim the input.
*
* @example
<example name="text-input-directive">
<example name="text-input-directive" module="textInputExample">
<file name="index.html">
<script>
function Ctrl($scope) {
$scope.text = 'guest';
$scope.word = /^\s*\w*\s*$/;
}
angular.module('textInputExample', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.text = 'guest';
$scope.word = /^\s*\w*\s*$/;
}]);
</script>
<form name="myForm" ng-controller="Ctrl">
<form name="myForm" ng-controller="ExampleController">
Single word: <input type="text" name="input" ng-model="text"
ng-pattern="word" required ng-trim="false">
<span class="error" ng-show="myForm.input.$error.required">
......@@ -16513,14 +16534,15 @@ var inputType = {
* interaction with the input element.
*
* @example
<example name="number-input-directive">
<example name="number-input-directive" module="numberExample">
<file name="index.html">
<script>
function Ctrl($scope) {
$scope.value = 12;
}
angular.module('numberExample', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.value = 12;
}]);
</script>
<form name="myForm" ng-controller="Ctrl">
<form name="myForm" ng-controller="ExampleController">
Number: <input type="number" name="input" ng-model="value"
min="0" max="99" required>
<span class="error" ng-show="myForm.input.$error.required">
......@@ -16588,14 +16610,15 @@ var inputType = {
* interaction with the input element.
*
* @example
<example name="url-input-directive">
<example name="url-input-directive" module="urlExample">
<file name="index.html">
<script>
function Ctrl($scope) {
$scope.text = 'http://google.com';
}
angular.module('urlExample', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.text = 'http://google.com';
}]);
</script>
<form name="myForm" ng-controller="Ctrl">
<form name="myForm" ng-controller="ExampleController">
URL: <input type="url" name="input" ng-model="text" required>
<span class="error" ng-show="myForm.input.$error.required">
Required!</span>
......@@ -16664,14 +16687,15 @@ var inputType = {
* interaction with the input element.
*
* @example
<example name="email-input-directive">
<example name="email-input-directive" module="emailExample">
<file name="index.html">
<script>
function Ctrl($scope) {
$scope.text = 'me@example.com';
}
angular.module('emailExample', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.text = 'me@example.com';
}]);
</script>
<form name="myForm" ng-controller="Ctrl">
<form name="myForm" ng-controller="ExampleController">
Email: <input type="email" name="input" ng-model="text" required>
<span class="error" ng-show="myForm.input.$error.required">
Required!</span>
......@@ -16730,18 +16754,19 @@ var inputType = {
* be set when selected.
*
* @example
<example name="radio-input-directive">
<example name="radio-input-directive" module="radioExample">
<file name="index.html">
<script>
function Ctrl($scope) {
$scope.color = 'blue';
$scope.specialValue = {
"id": "12345",
"value": "green"
};
}
angular.module('radioExample', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.color = 'blue';
$scope.specialValue = {
"id": "12345",
"value": "green"
};
}]);
</script>
<form name="myForm" ng-controller="Ctrl">
<form name="myForm" ng-controller="ExampleController">
<input type="radio" ng-model="color" value="red"> Red <br/>
<input type="radio" ng-model="color" ng-value="specialValue"> Green <br/>
<input type="radio" ng-model="color" value="blue"> Blue <br/>
......@@ -16780,15 +16805,16 @@ var inputType = {
* interaction with the input element.
*
* @example
<example name="checkbox-input-directive">
<example name="checkbox-input-directive" module="checkboxExample">
<file name="index.html">
<script>
function Ctrl($scope) {
$scope.value1 = true;
$scope.value2 = 'YES'
}
angular.module('checkboxExample', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.value1 = true;
$scope.value2 = 'YES'
}]);
</script>
<form name="myForm" ng-controller="Ctrl">
<form name="myForm" ng-controller="ExampleController">
Value1: <input type="checkbox" ng-model="value1"> <br/>
Value2: <input type="checkbox" ng-model="value2"
ng-true-value="YES" ng-false-value="NO"> <br/>
......@@ -17188,14 +17214,15 @@ function checkboxInputType(scope, element, attr, ctrl) {
* interaction with the input element.
*
* @example
<example name="input-directive">
<example name="input-directive" module="inputExample">
<file name="index.html">
<script>
function Ctrl($scope) {
$scope.user = {name: 'guest', last: 'visitor'};
}
angular.module('inputExample', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.user = {name: 'guest', last: 'visitor'};
}]);
</script>
<div ng-controller="Ctrl">
<div ng-controller="ExampleController">
<form name="myForm">
User name: <input type="text" name="userName" ng-model="user.name" required>
<span class="error" ng-show="myForm.userName.$error.required">
......@@ -17713,12 +17740,13 @@ var NgModelController = ['$scope', '$exceptionHandler', '$attrs', '$element', '$
* </pre>
*
* @example
* <example deps="angular-animate.js" animations="true" fixBase="true">
* <example deps="angular-animate.js" animations="true" fixBase="true" module="inputExample">
<file name="index.html">
<script>
function Ctrl($scope) {
$scope.val = '1';
}
angular.module('inputExample', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.val = '1';
}]);
</script>
<style>
.my-input {
......@@ -17733,7 +17761,7 @@ var NgModelController = ['$scope', '$exceptionHandler', '$attrs', '$element', '$
</style>
Update input to see transitions when valid/invalid.
Integer is a valid value.
<form name="testForm" ng-controller="Ctrl">
<form name="testForm" ng-controller="ExampleController">
<input ng-model="val" ng-pattern="/^\d+$/" name="anim" class="my-input" />
</form>
</file>
......@@ -17777,17 +17805,18 @@ var ngModelDirective = function() {
* in input value.
*
* @example
* <example name="ngChange-directive">
* <example name="ngChange-directive" module="changeExample">
* <file name="index.html">
* <script>
* function Controller($scope) {
* $scope.counter = 0;
* $scope.change = function() {
* $scope.counter++;
* };
* }
* angular.module('changeExample', [])
* .controller('ExampleController', ['$scope', function($scope) {
* $scope.counter = 0;
* $scope.change = function() {
* $scope.counter++;
* };
* }]);
* </script>
* <div ng-controller="Controller">
* <div ng-controller="ExampleController">
* <input type="checkbox" ng-model="confirmed" ng-change="change()" id="ng-change-example1" />
* <input type="checkbox" ng-model="confirmed" id="ng-change-example2" />
* <label for="ng-change-example2">Confirmed</label><br />
......@@ -17868,14 +17897,15 @@ var requiredDirective = function() {
* specified in form `/something/` then the value will be converted into a regular expression.
*
* @example
<example name="ngList-directive">
<example name="ngList-directive" module="listExample">
<file name="index.html">
<script>
function Ctrl($scope) {
$scope.names = ['igor', 'misko', 'vojta'];
}
angular.module('listExample', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.names = ['igor', 'misko', 'vojta'];
}]);
</script>
<form name="myForm" ng-controller="Ctrl">
<form name="myForm" ng-controller="ExampleController">
List: <input name="namesInput" ng-model="names" ng-list required>
<span class="error" ng-show="myForm.namesInput.$error.required">
Required!</span>
......@@ -17967,15 +17997,16 @@ var CONSTANT_VALUE_REGEXP = /^(true|false|\d+)$/;
* of the `input` element
*
* @example
<example name="ngValue-directive">
<example name="ngValue-directive" module="valueExample">
<file name="index.html">
<script>
function Ctrl($scope) {
$scope.names = ['pizza', 'unicorns', 'robots'];
$scope.my = { favorite: 'unicorns' };
}
angular.module('valueExample', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.names = ['pizza', 'unicorns', 'robots'];
$scope.my = { favorite: 'unicorns' };
}]);
</script>
<form ng-controller="Ctrl">
<form ng-controller="ExampleController">
<h2>Which is your favorite?</h2>
<label ng-repeat="name in names" for="{{name}}">
{{name}}
......@@ -18046,14 +18077,15 @@ var ngValueDirective = function() {
*
* @example
* Enter a name in the Live Preview text box; the greeting below the text box changes instantly.
<example>
<example module="bindExample">
<file name="index.html">
<script>
function Ctrl($scope) {
$scope.name = 'Whirled';
}
angular.module('bindExample', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.name = 'Whirled';
}]);
</script>
<div ng-controller="Ctrl">
<div ng-controller="ExampleController">
Enter name: <input type="text" ng-model="name"><br>
Hello <span ng-bind="name"></span>!
</div>
......@@ -18104,15 +18136,16 @@ var ngBindDirective = ngDirective({
*
* @example
* Try it here: enter text in text box and watch the greeting change.
<example>
<example module="bindExample">
<file name="index.html">
<script>
function Ctrl($scope) {
$scope.salutation = 'Hello';
$scope.name = 'World';
}
angular.module('bindExample', [])
.controller('ExampleController', ['$scope', function ($scope) {
$scope.salutation = 'Hello';
$scope.name = 'World';
}]);
</script>
<div ng-controller="Ctrl">
<div ng-controller="ExampleController">
Salutation: <input type="text" ng-model="salutation"><br>
Name: <input type="text" ng-model="name"><br>
<pre ng-bind-template="{{salutation}} {{name}}!"></pre>
......@@ -18170,20 +18203,20 @@ var ngBindTemplateDirective = ['$interpolate', function($interpolate) {
* @example
Try it here: enter text in text box and watch the greeting change.
<example module="ngBindHtmlExample" deps="angular-sanitize.js">
<example module="bindHtmlExample" deps="angular-sanitize.js">
<file name="index.html">
<div ng-controller="ngBindHtmlCtrl">
<div ng-controller="ExampleController">
<p ng-bind-html="myHTML"></p>
</div>
</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>';
}]);
angular.module('bindHtmlExample', ['ngSanitize'])
.controller('ExampleController', ['$scope', function($scope) {
$scope.myHTML =
'I am an <code>HTML</code>string with ' +
'<a href="#">links!</a> and other <em>stuff</em>';
}]);
</file>
<file name="protractor.js" type="protractor">
......@@ -18682,7 +18715,7 @@ var ngCloakDirective = ngDirective({
*
* This example demonstrates the `controller as` syntax.
*
* <example name="ngControllerAs">
* <example name="ngControllerAs" module="controllerAsExample">
* <file name="index.html">
* <div id="ctrl-as-exmpl" ng-controller="SettingsController1 as settings">
* Name: <input type="text" ng-model="settings.name"/>
......@@ -18703,6 +18736,9 @@ var ngCloakDirective = ngDirective({
* </div>
* </file>
* <file name="app.js">
* angular.module('controllerAsExample', [])
* .controller('SettingsController1', SettingsController1);
*
* function SettingsController1() {
* this.name = "John Smith";
* this.contacts = [
......@@ -18731,29 +18767,29 @@ var ngCloakDirective = ngDirective({
* <file name="protractor.js" type="protractor">
* it('should check controller as', function() {
* var container = element(by.id('ctrl-as-exmpl'));
* expect(container.findElement(by.model('settings.name'))
* expect(container.element(by.model('settings.name'))
* .getAttribute('value')).toBe('John Smith');
*
* var firstRepeat =
* container.findElement(by.repeater('contact in settings.contacts').row(0));
* container.element(by.repeater('contact in settings.contacts').row(0));
* var secondRepeat =
* container.findElement(by.repeater('contact in settings.contacts').row(1));
* container.element(by.repeater('contact in settings.contacts').row(1));
*
* expect(firstRepeat.findElement(by.model('contact.value')).getAttribute('value'))
* expect(firstRepeat.element(by.model('contact.value')).getAttribute('value'))
* .toBe('408 555 1212');
*
* expect(secondRepeat.findElement(by.model('contact.value')).getAttribute('value'))
* expect(secondRepeat.element(by.model('contact.value')).getAttribute('value'))
* .toBe('john.smith@example.org');
*
* firstRepeat.findElement(by.linkText('clear')).click();
* firstRepeat.element(by.linkText('clear')).click();
*
* expect(firstRepeat.findElement(by.model('contact.value')).getAttribute('value'))
* expect(firstRepeat.element(by.model('contact.value')).getAttribute('value'))
* .toBe('');
*
* container.findElement(by.linkText('add')).click();
* container.element(by.linkText('add')).click();
*
* expect(container.findElement(by.repeater('contact in settings.contacts').row(2))
* .findElement(by.model('contact.value'))
* expect(container.element(by.repeater('contact in settings.contacts').row(2))
* .element(by.model('contact.value'))
* .getAttribute('value'))
* .toBe('yourname@example.org');
* });
......@@ -18762,7 +18798,7 @@ var ngCloakDirective = ngDirective({
*
* This example demonstrates the "attach to `$scope`" style of controller.
*
* <example name="ngController">
* <example name="ngController" module="controllerExample">
* <file name="index.html">
* <div id="ctrl-exmpl" ng-controller="SettingsController2">
* Name: <input type="text" ng-model="name"/>
......@@ -18783,6 +18819,9 @@ var ngCloakDirective = ngDirective({
* </div>
* </file>
* <file name="app.js">
* angular.module('controllerExample', [])
* .controller('SettingsController2', ['$scope', SettingsController2]);
*
* function SettingsController2($scope) {
* $scope.name = "John Smith";
* $scope.contacts = [
......@@ -18812,28 +18851,28 @@ var ngCloakDirective = ngDirective({
* it('should check controller', function() {
* var container = element(by.id('ctrl-exmpl'));
*
* expect(container.findElement(by.model('name'))
* expect(container.element(by.model('name'))
* .getAttribute('value')).toBe('John Smith');
*
* var firstRepeat =
* container.findElement(by.repeater('contact in contacts').row(0));
* container.element(by.repeater('contact in contacts').row(0));
* var secondRepeat =
* container.findElement(by.repeater('contact in contacts').row(1));
* container.element(by.repeater('contact in contacts').row(1));
*
* expect(firstRepeat.findElement(by.model('contact.value')).getAttribute('value'))
* expect(firstRepeat.element(by.model('contact.value')).getAttribute('value'))
* .toBe('408 555 1212');
* expect(secondRepeat.findElement(by.model('contact.value')).getAttribute('value'))
* expect(secondRepeat.element(by.model('contact.value')).getAttribute('value'))
* .toBe('john.smith@example.org');
*
* firstRepeat.findElement(by.linkText('clear')).click();
* firstRepeat.element(by.linkText('clear')).click();
*
* expect(firstRepeat.findElement(by.model('contact.value')).getAttribute('value'))
* expect(firstRepeat.element(by.model('contact.value')).getAttribute('value'))
* .toBe('');
*
* container.findElement(by.linkText('add')).click();
* container.element(by.linkText('add')).click();
*
* expect(container.findElement(by.repeater('contact in contacts').row(2))
* .findElement(by.model('contact.value'))
* expect(container.element(by.repeater('contact in contacts').row(2))
* .element(by.model('contact.value'))
* .getAttribute('value'))
* .toBe('yourname@example.org');
* });
......@@ -19204,21 +19243,22 @@ forEach(
* ({@link guide/expression#-event- Event object is available as `$event`})
*
* @example
<example>
<example module="submitExample">
<file name="index.html">
<script>
function Ctrl($scope) {
$scope.list = [];
$scope.text = 'hello';
$scope.submit = function() {
if ($scope.text) {
$scope.list.push(this.text);
$scope.text = '';
}
};
}
angular.module('submitExample', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.list = [];
$scope.text = 'hello';
$scope.submit = function() {
if ($scope.text) {
$scope.list.push(this.text);
$scope.text = '';
}
};
}]);
</script>
<form ng-submit="submit()" ng-controller="Ctrl">
<form ng-submit="submit()" ng-controller="ExampleController">
Enter text and hit enter:
<input type="text" ng-model="text" name="text" />
<input type="submit" id="submit" value="Submit" />
......@@ -19230,7 +19270,7 @@ forEach(
expect(element(by.binding('list')).getText()).toBe('list=[]');
element(by.css('#submit')).click();
expect(element(by.binding('list')).getText()).toContain('hello');
expect(element(by.input('text')).getAttribute('value')).toBe('');
expect(element(by.model('text')).getAttribute('value')).toBe('');
});
it('should ignore empty strings', function() {
expect(element(by.binding('list')).getText()).toBe('list=[]');
......@@ -19503,9 +19543,9 @@ var ngIfDirective = ['$animate', function($animate) {
* - Otherwise enable scrolling only if the expression evaluates to truthy value.
*
* @example
<example module="ngAnimate" deps="angular-animate.js" animations="true">
<example module="includeExample" deps="angular-animate.js" animations="true">
<file name="index.html">
<div ng-controller="Ctrl">
<div ng-controller="ExampleController">
<select ng-model="template" ng-options="t.name for t in templates">
<option value="">(blank)</option>
</select>
......@@ -19517,12 +19557,13 @@ var ngIfDirective = ['$animate', function($animate) {
</div>
</file>
<file name="script.js">
function Ctrl($scope) {
$scope.templates =
[ { name: 'template1.html', url: 'template1.html'},
{ name: 'template2.html', url: 'template2.html'} ];
$scope.template = $scope.templates[0];
}
angular.module('includeExample', ['ngAnimate'])
.controller('ExampleController', ['$scope', function($scope) {
$scope.templates =
[ { name: 'template1.html', url: 'template1.html'},
{ name: 'template2.html', url: 'template2.html'} ];
$scope.template = $scope.templates[0];
}]);
</file>
<file name="template1.html">
Content of template1.html
......@@ -19585,7 +19626,7 @@ var ngIfDirective = ['$animate', function($animate) {
return;
}
templateSelect.click();
templateSelect.element.all(by.css('option')).get(2).click();
templateSelect.all(by.css('option')).get(2).click();
expect(includeElem.getText()).toMatch(/Content of template2.html/);
});
......@@ -19595,7 +19636,7 @@ var ngIfDirective = ['$animate', function($animate) {
return;
}
templateSelect.click();
templateSelect.element.all(by.css('option')).get(0).click();
templateSelect.all(by.css('option')).get(0).click();
expect(includeElem.isPresent()).toBe(false);
});
</file>
......@@ -19747,14 +19788,15 @@ var ngIncludeFillContentDirective = ['$compile',
* @param {expression} ngInit {@link guide/expression Expression} to eval.
*
* @example
<example>
<example module="initExample">
<file name="index.html">
<script>
function Ctrl($scope) {
$scope.list = [['a', 'b'], ['c', 'd']];
}
angular.module('initExample', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.list = [['a', 'b'], ['c', 'd']];
}]);
</script>
<div ng-controller="Ctrl">
<div ng-controller="ExampleController">
<div ng-repeat="innerList in list" ng-init="outerIndex = $index">
<div ng-repeat="value in innerList" ng-init="innerIndex = $index">
<span class="example-init">list[ {{outerIndex}} ][ {{innerIndex}} ] = {{value}};</span>
......@@ -19907,16 +19949,17 @@ var ngNonBindableDirective = ngDirective({ terminal: true, priority: 1000 });
* @param {number=} offset Offset to deduct from the total number.
*
* @example
<example>
<example module="pluralizeExample">
<file name="index.html">
<script>
function Ctrl($scope) {
$scope.person1 = 'Igor';
$scope.person2 = 'Misko';
$scope.personCount = 1;
}
angular.module('pluralizeExample', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.person1 = 'Igor';
$scope.person2 = 'Misko';
$scope.personCount = 1;
}]);
</script>
<div ng-controller="Ctrl">
<div ng-controller="ExampleController">
Person 1:<input type="text" ng-model="person1" value="Igor" /><br/>
Person 2:<input type="text" ng-model="person2" value="Misko" /><br/>
Number of People:<input type="text" ng-model="personCount" value="1" /><br/>
......@@ -20850,9 +20893,9 @@ var ngStyleDirective = ngDirective(function(scope, element, attr) {
*
*
* @example
<example module="ngAnimate" deps="angular-animate.js" animations="true">
<example module="switchExample" deps="angular-animate.js" animations="true">
<file name="index.html">
<div ng-controller="Ctrl">
<div ng-controller="ExampleController">
<select ng-model="selection" ng-options="item for item in items">
</select>
<tt>selection={{selection}}</tt>
......@@ -20866,10 +20909,11 @@ var ngStyleDirective = ngDirective(function(scope, element, attr) {
</div>
</file>
<file name="script.js">
function Ctrl($scope) {
$scope.items = ['settings', 'home', 'other'];
$scope.selection = $scope.items[0];
}
angular.module('switchExample', ['ngAnimate'])
.controller('ExampleController', ['$scope', function($scope) {
$scope.items = ['settings', 'home', 'other'];
$scope.selection = $scope.items[0];
}]);
</file>
<file name="animations.css">
.animate-switch-container {
......@@ -20912,11 +20956,11 @@ var ngStyleDirective = ngDirective(function(scope, element, attr) {
expect(switchElem.getText()).toMatch(/Settings Div/);
});
it('should change to home', function() {
select.element.all(by.css('option')).get(1).click();
select.all(by.css('option')).get(1).click();
expect(switchElem.getText()).toMatch(/Home Span/);
});
it('should select default', function() {
select.element.all(by.css('option')).get(2).click();
select.all(by.css('option')).get(2).click();
expect(switchElem.getText()).toMatch(/default/);
});
</file>
......@@ -21008,15 +21052,10 @@ var ngSwitchDefaultDirective = ngDirective({
* @element ANY
*
* @example
<example module="transclude">
<example module="transcludeExample">
<file name="index.html">
<script>
function Ctrl($scope) {
$scope.title = 'Lorem Ipsum';
$scope.text = 'Neque porro quisquam est qui dolorem ipsum quia dolor...';
}
angular.module('transclude', [])
angular.module('transcludeExample', [])
.directive('pane', function(){
return {
restrict: 'E',
......@@ -21027,9 +21066,13 @@ var ngSwitchDefaultDirective = ngDirective({
'<div ng-transclude></div>' +
'</div>'
};
});
})
.controller('ExampleController', ['$scope', function($scope) {
$scope.title = 'Lorem Ipsum';
$scope.text = 'Neque porro quisquam est qui dolorem ipsum quia dolor...';
}]);
</script>
<div ng-controller="Ctrl">
<div ng-controller="ExampleController">
<input ng-model="title"><br>
<textarea ng-model="text"></textarea> <br/>
<pane title="{{title}}">{{text}}</pane>
......@@ -21188,21 +21231,22 @@ var ngOptionsMinErr = minErr('ngOptions');
* `value` variable (e.g. `value.propertyName`).
*
* @example
<example>
<example module="selectExample">
<file name="index.html">
<script>
function MyCntrl($scope) {
$scope.colors = [
{name:'black', shade:'dark'},
{name:'white', shade:'light'},
{name:'red', shade:'dark'},
{name:'blue', shade:'dark'},
{name:'yellow', shade:'light'}
];
$scope.myColor = $scope.colors[2]; // red
}
angular.module('selectExample', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.colors = [
{name:'black', shade:'dark'},
{name:'white', shade:'light'},
{name:'red', shade:'dark'},
{name:'blue', shade:'dark'},
{name:'yellow', shade:'light'}
];
$scope.myColor = $scope.colors[2]; // red
}]);
</script>
<div ng-controller="MyCntrl">
<div ng-controller="ExampleController">
<ul>
<li ng-repeat="color in colors">
Name: <input ng-model="color.name">
......@@ -21239,7 +21283,7 @@ var ngOptionsMinErr = minErr('ngOptions');
<file name="protractor.js" type="protractor">
it('should check ng-options', function() {
expect(element(by.binding('{selected_color:myColor}')).getText()).toMatch('red');
element.all(by.select('myColor')).first().click();
element.all(by.model('myColor')).first().click();
element.all(by.css('select[ng-model="myColor"] option')).first().click();
expect(element(by.binding('{selected_color:myColor}')).getText()).toMatch('black');
element(by.css('.nullable select[ng-model="myColor"]')).click();
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7