docs(examples): update example apps

This commit is contained in:
Igor Minar 2012-03-28 10:50:46 -07:00 committed by Misko Hevery
parent 8b93541522
commit ba59ef4950
6 changed files with 59 additions and 57 deletions

View file

@ -1,28 +1,31 @@
<!doctype html>
<html xmlns:ng="http://angularjs.org" ng:app>
<html ng-app>
<head>
<title>Personal Log</title>
<script type="text/javascript" src="../../src/angular-bootstrap.js"></script>
<script type="text/javascript" src="personalLog.js"></script>
<script src="../../src/loader.js"></script>
<script>
setupModuleLoader(window);
</script>
<script src="personalLog.js"></script>
<script src="../../src/angular-bootstrap.js"></script>
<script src="../../src/ngCookies/cookies.js"></script>
</head>
<!-- TODO: we need to expose $root so that we can delete cookies in the scenario runner, there
must be a better way to do this -->
<body ng:controller="example.personalLog.LogCtrl">
<body ng-controller="LogCtrl">
<form action="" ng:submit="addLog(newMsg)">
<input type="text" ng:model="newMsg" />
<input type="submit" value="add" />
<input type="button" value="remove all" ng:click="rmLogs()" />
<form action="" ng-submit="addLog(newMsg)">
<input type="text" ng-model="newMsg">
<input type="submit" value="add">
<input type="button" value="remove all" ng-click="rmLogs()">
</form>
<hr/>
<h2>Logs:</h2>
<ul>
<li ng:repeat="log in logs | orderBy:'-at'">
<li ng-repeat="log in logs | orderBy:'-at'">
{{log.at | date:'yy-MM-dd HH:mm'}} {{log.msg}}
[<a href="" ng:click="rmLog(log)">x</a>]
[<a href="" ng-click="rmLog(log)">x</a>]
</li>
</ul>

View file

@ -5,28 +5,23 @@
* - testability of controllers
* - dependency injection for controllers via $inject and constructor function
* - $cookieStore for persistent cookie-backed storage
* - simple templating constructs such as ng:repeat and {{}}
* - simple templating constructs such as ng-repeat and {{}}
* - date filter
* - and binding onSubmit and onClick events to angular expressions
* @author Igor Minar
*/
/** @namespace the 'example' namespace */
var example = example || {};
/** @namespace namespace of the personal log app */
example.personalLog = {};
//name space isolating closure
(function() {
var app = angular.module('personalLog', ['ngCookies']);
var LOGS = 'logs';
/**
* The controller for the personal log app.
*/
function LogCtrl($cookieStore, $scope) {
app.controller('LogCtrl', ['$cookieStore', '$scope', function LogCtrl($cookieStore, $scope) {
var logs = $scope.logs = $cookieStore.get(LOGS) || []; //main model
@ -72,11 +67,6 @@ function LogCtrl($cookieStore, $scope) {
logs.splice(0, logs.length);
$cookieStore.remove(LOGS);
};
}
}]);
//inject
LogCtrl.$inject = ['$cookieStore', '$scope'];
//export
example.personalLog.LogCtrl = LogCtrl;
})();

View file

@ -1,12 +1,13 @@
describe('example.personalLog.LogCtrl', function() {
var logScope;
beforeEach(function() {
var injector = angular.injector(['ng', 'ngMock', 'ngCookies']);
logScope = injector.get('$rootScope');
logScope.$cookies = injector.get('$cookies');
injector.instantiate(example.personalLog.LogCtrl, {$scope: logScope});
});
beforeEach(module('personalLog'));
beforeEach(inject(function($rootScope, $controller) {
logScope = $rootScope.$new();
$controller('LogCtrl', {$scope: logScope});
}));
it('should initialize notes with an empty array', function() {
@ -43,11 +44,11 @@ describe('example.personalLog.LogCtrl', function() {
});
it('should store logs in the logs cookie', function() {
expect(logScope.$cookies.logs).not.toBeDefined();
it('should store logs in the logs cookie', inject(function($cookies) {
expect($cookies.logs).not.toBeDefined();
logScope.addLog('first log message');
expect(logScope.$cookies.logs).toBeTruthy();
});
expect($cookies.logs).toBeTruthy();
}));
it('should do nothing if newMsg is empty', function() {
@ -79,17 +80,17 @@ describe('example.personalLog.LogCtrl', function() {
});
it('should update cookies when a log is deleted', function() {
expect(logScope.$cookies.logs).toMatch(/\[\{.*?\}(,\{.*?\}){3}\]/);
it('should update cookies when a log is deleted', inject(function($cookies) {
expect($cookies.logs).toMatch(/\[\{.*?\}(,\{.*?\}){3}\]/);
logScope.rmLog(logScope.logs[1]);
expect(logScope.$cookies.logs).toMatch(/\[\{.*?\}(,\{.*?\}){2}\]/);
expect($cookies.logs).toMatch(/\[\{.*?\}(,\{.*?\}){2}\]/);
logScope.rmLog(logScope.logs[0]);
logScope.rmLog(logScope.logs[0]);
logScope.rmLog(logScope.logs[0]);
expect(logScope.$cookies.logs).toMatch(/\[\]/);
});
expect($cookies.logs).toMatch(/\[\]/);
}));
});
@ -110,10 +111,10 @@ describe('example.personalLog.LogCtrl', function() {
});
it('should remove logs cookie', function() {
expect(logScope.$cookies.logs).toBeTruthy();
it('should remove logs cookie', inject(function($cookies) {
expect($cookies.logs).toBeTruthy();
logScope.rmLogs();
expect(logScope.$cookies.logs).not.toBeDefined();
});
expect($cookies.logs).not.toBeDefined();
}));
});
});

View file

@ -1,22 +1,30 @@
<!doctype html>
<html xmlns:ng="http://angularjs.org" ng:app>
<html ng-app="example">
<head>
<title>angular dev sandbox</title>
<script src="../src/angular-bootstrap.js"></script>
<script src="../src/loader.js"></script>
<script>
angular.module.ng('routeConfig', function($route) {
$route.when('/view1', {controller: MyCtrl, template: 'view1.html'});
$route.when('/view2', {controller: MyCtrl, template: 'view2.html'});
setupModuleLoader(window);
angular.module('example', [], function($routeProvider) {
$routeProvider.when('/view1', {controller: MyCtrl, template: 'view1.html'});
$routeProvider.when('/view2', {controller: MyCtrl, template: 'view2.html'});
function MyCtrl() {};
}, {$inject: ['$route']});
function MyCtrl($location, $scope) {
$scope.url = function() {
return $location.url();
}
};
});
</script>
<script src="../src/angular-bootstrap.js"></script>
</head>
<body ng:init="$service('$window').$root = this">
<body>
<p>
<a href="#/view1">view1</a> | <a href="#/view2">view2</a> | <a href="#">blank</a>
</p>
view: <ng:view></ng:view>
<hr>
<div ng-view></div>
</body>
</html>

View file

@ -1,2 +1,2 @@
view1<br>
location: {{$service('$location').href}}
location: {{url()}}

View file

@ -1,2 +1,2 @@
view2<br/>
location: {{$service('$location').href}}<br/>
location: {{url()}}<br/>