iSharkFly-Docs
/
angular-docs-cn
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/master' 

# Conflicts:
#	public/_data.json
#	public/_includes/_hero-home.jade
#	public/docs/ts/latest/_data.json
#	public/docs/ts/latest/cookbook/component-communication.jade
#	public/docs/ts/latest/cookbook/dependency-injection.jade
#	public/docs/ts/latest/guide/_data.json
#	public/docs/ts/latest/guide/attribute-directives.jade
#	public/docs/ts/latest/guide/dependency-injection.jade
#	public/docs/ts/latest/guide/displaying-data.jade
#	public/docs/ts/latest/guide/forms.jade
#	public/docs/ts/latest/guide/index.jade
#	public/docs/ts/latest/guide/style-guide.jade
#	public/docs/ts/latest/quickstart.jade
#	public/docs/ts/latest/tutorial/toh-pt4.jade
#	public/docs/ts/latest/tutorial/toh-pt5.jade
#	public/news.jade
#	public/resources/index.jade
This commit is contained in:
Zhicheng Wang 2016-05-19 13:33:02 +08:00
parent ce4f1910d4 31fe01e01f
commit 5f1f27e09c
603 changed files with 8948 additions and 6591 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.gitignore vendored
View File

@ -20,7 +20,7 @@ _.*
public/docs/xref-*.*
_zip-output
www
/npm-debug.log
npm-debug.log
npm-debug.log.*
*.plnkr.html
plnkr.html

2
README.md
View File

@ -62,7 +62,7 @@ For example, all of the TypeScript docs are in `public/docs/ts/latest`, e.g.
If you are only going to work on a specific part of the docs, such as the dev guide, then you can use one of the more specific gulp tasks to only watch those parts of the file system:
* `gulp serve-and-sync` : watch all the local Jade/Sass files, the API source and examples, and the dev guide files
* `gulp serve-and-sync-api-docs` : watch only the API source and example files
* `gulp serve-and-sync-api` : watch only the API source and example files
* `gulp serve-and-sync-devguide` : watch only the dev guide files
* `gulp build-and-serve` : watch only the local Jade/Sass files

4
firebase.json
View File

@ -57,6 +57,10 @@
{
"source": "/dart",
"destination": "/docs/dart/latest/index.html"
},
{
"source": "/styleguide",
"destination": "/docs/ts/latest/guide/style-guide.html"
}
],
"ignore": [

55
gulpfile.js
View File

@ -109,10 +109,12 @@ gulp.task('run-e2e-tests', function() {
// with the corresponding apps that they should run under. Then run
// each app/spec collection sequentially.
function findAndRunE2eTests(filter) {
var lang = (argv.lang || '(ts|js)').toLowerCase();
if (lang === 'all') { lang = '(ts|js|dart)'; }
var startTime = new Date().getTime();
// create an output file with header.
var outputFile = path.join(process.cwd(), 'protractor-results.txt');
var header = "Protractor example results for: " + (new Date()).toLocaleString() + "\n\n";
var header = "Protractor example results for " + lang + " on " + (new Date()).toLocaleString() + "\n\n";
if (filter) {
header += ' Filter: ' + filter.toString() + '\n\n';
}
@ -128,6 +130,10 @@ function findAndRunE2eTests(filter) {
fsExtra.copySync(srcConfig, destConfig);
// get all of the examples under each dir where a pcFilename is found
examplePaths = getExamplePaths(specPath, true);
// Filter by language
examplePaths = examplePaths.filter(function (fn) {
return fn.match('/'+lang+'$') != null;
});
if (filter) {
examplePaths = examplePaths.filter(function (fn) {
return fn.match(filter) != null;
@ -142,7 +148,9 @@ function findAndRunE2eTests(filter) {
var status = { passed: [], failed: [] };
return exeConfigs.reduce(function (promise, combo) {
return promise.then(function () {
return runE2eTests(combo.examplePath, combo.protractorConfigFilename, outputFile).then(function(ok) {
var isDart = combo.examplePath.indexOf('/dart') > -1;
var runTests = isDart ? runE2eDartTests : runE2eTsTests;
return runTests(combo.examplePath, combo.protractorConfigFilename, outputFile).then(function(ok) {
var arr = ok ? status.passed : status.failed;
arr.push(combo.examplePath);
})
@ -158,12 +166,16 @@ function findAndRunE2eTests(filter) {
// start the example in appDir; then run protractor with the specified
// fileName; then shut down the example. All protractor output is appended
// to the outputFile.
function runE2eTests(appDir, protractorConfigFilename, outputFile ) {
function runE2eTsTests(appDir, protractorConfigFilename, outputFile) {
// start the app
var appRunSpawnInfo = spawnExt('npm',['run','http-server:e2e', '--', '-s' ], { cwd: appDir });
var tscRunSpawnInfo = spawnExt('npm',['run','tsc'], { cwd: appDir });
return tscRunSpawnInfo.promise.then(function(data) {
return runProtractor(tscRunSpawnInfo.promise, appDir, appRunSpawnInfo, protractorConfigFilename, outputFile);
}
function runProtractor(prepPromise, appDir, appRunSpawnInfo, protractorConfigFilename, outputFile) {
return prepPromise.then(function (data) {
// start protractor
var pcFilename = path.resolve(protractorConfigFilename); // need to resolve because we are going to be running from a different dir
var exePath = path.join(process.cwd(), "./node_modules/.bin/");
@ -175,7 +187,7 @@ function runE2eTests(appDir, protractorConfigFilename, outputFile ) {
// Ugh... proc.kill does not work properly on windows with child processes.
// appRun.proc.kill();
treeKill(appRunSpawnInfo.proc.pid);
return true;
return !data;
}).fail(function(err) {
// Ugh... proc.kill does not work properly on windows with child processes.
// appRun.proc.kill();
@ -184,19 +196,39 @@ function runE2eTests(appDir, protractorConfigFilename, outputFile ) {
});
}
// start the server in appDir/build/web; then run protractor with the specified
// fileName; then shut down the example. All protractor output is appended
// to the outputFile.
function runE2eDartTests(appDir, protractorConfigFilename, outputFile) {
var deployDir = path.resolve(path.join(appDir, 'build/web'));
gutil.log('AppDir for Dart e2e: ' + appDir);
gutil.log('Deploying from: ' + deployDir);
var appRunSpawnInfo = spawnExt('npm', ['run', 'http-server:e2e', '--', deployDir, '-s'], { cwd: EXAMPLES_PATH });
if (!appRunSpawnInfo.proc.pid) {
gutil.log('http-server failed to launch over ' + deployDir);
return false;
}
var pubUpgradeSpawnInfo = spawnExt('pub', ['upgrade'], { cwd: appDir });
var prepPromise = pubUpgradeSpawnInfo.promise.then(function (data) {
return spawnExt('pub', ['build'], { cwd: appDir }).promise;
});
return runProtractor(prepPromise, appDir, appRunSpawnInfo, protractorConfigFilename, outputFile);
}
function reportStatus(status) {
gutil.log('Suites passed:');
status.passed.forEach(function(val) {
gutil.log(' ' + val);
});
gutil.log('Suites failed:');
status.failed.forEach(function(val) {
gutil.log(' ' + val);
});
if (status.failed.length == 0) {
gutil.log('All tests passed');
} else {
gutil.log('Suites failed:');
status.failed.forEach(function (val) {
gutil.log(' ' + val);
});
}
gutil.log('Elapsed time: ' + status.elapsedTime + ' seconds');
}
@ -808,7 +840,8 @@ function devGuideExamplesWatch(shredOptions, postShredAction) {
// removed this version because gulp.watch has the same glob issue that dgeni has.
// var excludePattern = '!' + path.join(shredOptions.examplesDir, '**/node_modules/**/*.*');
// gulp.watch([includePattern, excludePattern], {readDelay: 500}, function (event, done) {
var files = globby.sync( [includePattern], { ignore: [ '**/node_modules/**', '**/_fragments/**']});
var files = globby.sync( [includePattern], { ignore: [ '**/node_modules/**', '**/_fragments/**',
'**/dart/build/**' ]});
gulp.watch([files], {readDelay: 500}, function (event, done) {
gutil.log('Dev Guide example changed')
gutil.log('Event type: ' + event.type); // added, changed, or deleted

1
harp.json
View File

@ -290,6 +290,7 @@
"name": "Stephen Fluin",
"picture": "/resources/images/bios/stephenfluin.jpg",
"twitter": "stephenfluin",
"website": "https://plus.google.com/+stephenfluin",
"bio": "Stephen is a Developer Advocate working on the Angular team. Before joining Google, he was a Google Expert. Stephen loves to help enterprises use technology more effectively.",
"type": "Google"
},

6
package.json
View File

@ -17,8 +17,8 @@
},
"licenses": [
{
"type": "Apache",
"url": "http://www.apache.org/licenses/LICENSE-2.0.html"
"type": "MIT",
"url": "https://github.com/angular/angular.io/blob/master/LICENSE"
}
],
"bugs": {
@ -34,7 +34,7 @@
"codelyzer": "0.0.18",
"del": "^1.2.0",
"dgeni": "^0.4.0",
"dgeni-packages": "^0.11.1",
"dgeni-packages": "^0.13.0",
"diff": "^2.1.3",
"fs-extra": "^0.24.0",
"glob": "^5.0.14",

4
public/_data.json
View File

@ -47,9 +47,5 @@
"tooling": {
"title": "工具与库"
},
"all-resources": {
"title": "资源"
}
}

8
public/_includes/_hero-home.jade
View File

@ -7,11 +7,3 @@ header(class="background-sky")
h2 点击“译文”可显示/隐藏“原文”，点击“原文”可隐藏自身
.banner.banner-floaty
.banner-ng-annoucement
div(class="banner-text")
p Watch the ng-conf Live Stream May 4th-6th. 
p 观看 ng-conf 实时视频 May 4th-6th. 
div(class="banner-button")
a(href="https://www.ng-conf.org/#/extended" target="_blank" class="button md-button") View Live Stream
a(href="https://www.ng-conf.org/#/extended" target="_blank" class="button md-button") 查看实时视频

11
public/_includes/_hero.jade
View File

@ -4,6 +4,12 @@
- var capitalize = function capitalize(str) { return str.charAt(0).toUpperCase() + str.slice(1); }
- var useBadges = docType || stability;
// renamer :: String -> String
// Renames `Let` and `Var` into `Const`
- var renamer = function renamer(docType) {
- return (docType === 'Let' || docType === 'Var') ? 'Const' : docType
- }
if current.path[4] && current.path[3] == 'api'
- var textFormat = 'is-standard-case'
@ -14,12 +20,15 @@ header(class="hero background-sky")
span(class="badges")
if docType
span(class="status-badge").
#{capitalize(docType)}
#{renamer(capitalize(docType))}
if stability
span(layout="row" class="status-badge")
// badge circle is filled based on stability by matching a css selector in _hero.scss
span(class="status-circle status-#{stability}")
span Stability: #{capitalize(stability)}
if security
span(class="status-badge security-risk-badge").
Security Risk
if subtitle
h2.hero-subtitle.text-subhead #{subtitle}

6
public/_includes/_scripts-include.jade
View File

@ -12,12 +12,18 @@ script(src="/resources/js/vendor/angular-animate.min.js")
script(src="/resources/js/vendor/angular-aria.min.js")
script(src="/resources/js/vendor/angular-material.min.js")
<!-- Firebase -->
<script src="https://cdn.firebase.com/js/client/2.2.4/firebase.js"></script>
<!-- AngularFire -->
<script src="https://cdn.firebase.com/libs/angularfire/1.2.0/angularfire.min.js"></script>
<!-- Angular.io Site JS -->
script(src="/resources/js/translate.js")
script(src="/resources/js/site.js")
script(src="/resources/js/controllers/app-controller.js")
script(src="/resources/js/controllers/resources-controller.js")
script(src="/resources/js/directives/cheatsheet.js")
script(src="/resources/js/directives/api-list.js")
script(src="/resources/js/directives/bio.js")

93
public/_includes/_util-fns.jade
View File

@ -1,5 +1,56 @@
//- Mixins and associated functions
//- _docsFor: used to identify the language this version of the docs if for;
//- Should be one of: 'ts', 'dart' or 'js'. Set in lang specific _util-fns file.
- var _docsFor = '';
//- Should match `_docsFor`, but in this case provides the full capitalized
//- name of the language.
- var _Lang = 'TypeScript';
//- Simple "macros" used via interpolation in text:
//- e.g., the #{_priv}el variable has an `@Input` #{_decorator}.
//- Use #{_decorator} whereever the word "decorator" is expected, provided it is not
//- preceded by the article "a". (E.g., will be "annotation" for Dart)
- var _decorator = 'decorator';
//- Articles (which toggle between 'a' and 'an'). Used for, e.g.,
//- array vs. list; decorator vs. annotation.
- var _a = 'a';
- var _an = 'an';
//- TS arrays vs. Dart lists
- var _array = 'array';
//- Deprecate now that we have the articles _a and _an
- var _an_array = 'an array';
//- Promise vs. Future, etc
- var _Promise = 'Promise';
- var _Observable = 'Observable';
//- Location of sample code
- var _liveLink = 'live link';
//- Used to prefix identifiers that are private. In Dart this will be '_'.
- var _priv = '';
//- Use to conditionally include the block that follows +ifDocsFor(...).
//- Generally favor use of Jade named blocks instead. ifDocsFor is convenient
//- for prose that should appear only in one language version.
mixin ifDocsFor(lang)
if _docsFor.toLowerCase() === lang.toLowerCase()
block
//- Use to map inlined (prose) TS paths into, say, Dart paths via the
//- adjustExamplePath transformer function.
mixin adjExPath(path)
if adjustExamplePath
| #{adjustExamplePath(path)}
else
| #{path}
mixin includeShared(filePath, region)
- var newPath = translatePath(filePath, region);
!=partial(newPath)
@ -11,6 +62,7 @@ mixin makeExample(_filePath, region, _title, stylePatterns)
- var frag = getFrag(filePath, region);
- var defaultFormat = frag.split('\n').length > 2 ? "linenums" : "";
- var format = attributes.format || defaultFormat;
- if (attributes.format === '.') format = '';
- var avoid = !!attributes.avoid;
if (title)
@ -21,10 +73,49 @@ mixin makeExample(_filePath, region, _title, stylePatterns)
code-example(language="#{language}" format="#{format}")
!= styleString(frag, stylePatterns)
//- Like makeExample, but the first argument is a path that is
//- relative to the project root. Unless title is defined,
//- the project relative path will be used.
mixin makeProjExample(projRootRelativePath, region, title, stylePatterns)
- var relPath = projRootRelativePath.trim();
- var filePath = getExampleName() + '/ts/' + relPath;
- if (!title) {
- // Is path like styles.1.css? Then drop the '.1' qualifier:
- var matches = relPath.match(/^(.*)\.\d(\.\w+)$/);
- title = matches ? matches[1] + matches[2] : relPath;
- }
+makeExample(filePath, region, title, stylePatterns)
//- Like makeExample, but doesn't show line numbers, and the first
//- argument is a path that is relative to the example project root.
//- Unless title is defined, the project relative path will be used.
//- Title will always end with a phrase in parentheses; if no such
//- ending is given, then the title will be suffixed with
//- either "(excerpt)", or "(#{region})" when region is defined.
mixin makeExcerpt(projRootRelativePath, region, title, stylePatterns)
- var relPath = projRootRelativePath.trim();
- var filePath = getExampleName() + '/ts/' + relPath;
- if (!title) {
- // Is path like styles.1.css? Then drop the '.1' qualifier:
- var matches = relPath.match(/^(.*)\.\d(\.\w+)$/);
- title = matches ? matches[1] + matches[2] : relPath;
- }
- var excerpt = region || 'excerpt';
- if (title && !title.match(/\([\w ]+\)$/)) title = title + ' (' + excerpt + ')';
+makeExample(filePath, region, title, stylePatterns)(format='.')
//- Extract the doc example name from `current`.
- var getExampleName = function() {
- var dir = current.path[current.path.length - 1];
- return dir == 'latest' ? current.source : dir;
- };
mixin makeTabs(filePaths, regions, tabNames, stylePatterns)
- filePaths = strSplit(filePaths);
- if (adjustExamplePath) filePaths = filePaths.map(adjustExamplePath);
- regions = strSplit(regions, filePaths.length);
- tabNames = strSplit(tabNames, filePaths.length);
- if (adjustExampleTitle) tabNames = tabNames.map(adjustExampleTitle);
code-tabs
each filePath,index in filePaths
@ -77,7 +168,7 @@ script.
el.style.display = isVerbose ? 'block' : 'none';
var el = document.querySelector('button.verbose.on');
el.style.display = isVerbose ? 'none' : 'block';
CCSStylesheetRuleStyle('main','.l-verbose-section', 'display',
isVerbose ? 'block' : 'none');
}

200
public/all-resources.jade
View File

@ -1,200 +0,0 @@
div
p(class="text-body") Would you like to be listed in this page? Fill out this <a href="https://docs.google.com/a/rangle.io/forms/d/1qzWaDpTgTPe4iPDRF_VCT9aHXKimUocwlFnVJUdKabY/viewform?c=0&w=1">form</a>.
div(style="display: flex; justify-content: space-between; flex-wrap: wrap;")
div
h1 Books
div(class="resources")
h3 Packt Publishing
ul(class="publisher")
li(class="book")
a(class="title text-body" href="https://www.packtpub.com/web-development/switching-angular-2") Switching to Angular 2
li(class="book")
a(class="title text-body" href="https://www.packtpub.com/web-development/mastering-angular-2-components") Mastering Angular 2 Components
li(class="book")
a(class="title text-body" href="https://www.packtpub.com/web-development/angular-2-blueprints") Angular 2 Blueprints
li(class="book")
a(class="title text-body" href="https://www.packtpub.com/web-development/angular-2-example") Angular 2 By Examples
li(class="book")
a(class="title text-body" href="https://www.packtpub.com/web-development/mastering-angular-2-components") Angular 2 Components
li(class="book")
a(class="title text-body" href="https://www.packtpub.com/web-development/learning-angular-2-net-developers") Learning Angular 2 for .NET Developers
li(class="book")
a(class="title text-body" href="https://www.packtpub.com/web-development/angular-2-test-driven-development") Angular 2 Test-driven Development
h3 Manning Publications
ul(class="publisher")
li(class="book")
a(class="title text-body" href="https://www.manning.com/books/angular-2-in-action") Angular 2 In Action
li(class="book")
a(class="title text-body" href="https://www.manning.com/books/angular-2-development-with-typescript") Angular 2 Development with TypeScript
li(class="book")
a(class="title text-body" href="https://www.manning.com/books/testing-angular-2-applications") Testing Angular 2 Applications
h3 O'Reilly Media
ul(class="publisher")
li(class="book")
a(class="title text-body" href="http://www.oreilly.com/pub/e/3693") Angular 2 Web Development with TypeScript
li(class="book")
a(class="title text-body" href="http://shop.oreilly.com/product/0636920051824.do") Migrating to Angular 2
li(class="book")
a(class="title text-body" href="http://shop.oreilly.com/product/9781785886201.do") Switching to Angular 2
h3 Self-published
ul(class="publisher")
li(class="book")
a(class="title text-body" href="http://ngcourse.rangle.io/") Rangle.io: ngCourse 2
li(class="book")
a(class="title text-body" href="https://www.ng-book.com/2/") ng-book 2
li(class="book")
a(class="title text-body" href="https://leanpub.com/angular2-book") Angular 2 Book
li(class="book")
a(class="title text-body" href="https://books.ninja-squad.com/angular2") Become a ninja with Angular 2
li(class="book")
a(class="title text-body" href="https://leanpub.com/practical-angular-2") Practical Angular 2
div
h1 Training
div(class="resources")
h3 Rangle.io
ul(class="publisher")
li(class="course")
a(class="title text-body" href="http://rangle.io/services/javascript-training/training-angular1-angular2-with-ngupgrade/") Angular 2 Online Training
h3 Pluralsight
ul(class="publisher")
li(class="course")
a(class="title text-body" href="https://www.pluralsight.com/courses/angular-2-first-look") Angular 2: First Look
li(class="course")
a(class="title text-body" href="https://www.pluralsight.com/courses/angular-2-getting-started") Angular 2: Getting Started
h3 Udemy
ul(class="publisher")
li
a(class="title text-body" href="https://www.udemy.com/the-complete-guide-to-angular-2/?utm_content=_._ag_angular%202_._ad_47395956109_._de_c_._dm__._lo_9061189_._&matchtype=b&gclid=CjwKEAjww9O3BRDp1tq0jIP023YSJAB0-j1S4bFN4tudrjzZO_-ABNAfFQJrhrKo7KX1AnV-8yjV-hoCRrDw_wcB&utm_medium=udemyads&k_clickid=dce13cd7-9844-44dc-9967-020275b637c9_408_GOOGLE_NEW-AW-PROS-TECH-Dev-angular-2-EN-ENG_._ci_756150_._sl_ENG_._vi_TECH_._sd_All_._la_EN_.__angular%202_%2Bangular%20%2B2_b_47395956109_c&utm_campaign=NEW-AW-PROS-TECH-Dev-angular-2-EN-ENG_._ci_756150_._sl_ENG_._vi_TECH_._sd_All_._la_EN_._&utm_source=adwords&utm_term=_._pl__._pd__._ti_kwd-68757357257_._kw_%2Bangular%20%2B2_._&pmtag=72bf13dc-329c-411c-b381-a6143735b9dc") The Complete Guide to Angular 2
li
a(class="title text-body" href="https://www.udemy.com/angular-2-tutorial-for-beginners/") Angular 2 With TypeScript for Beginners
li
a(class="title text-body" href="https://www.udemy.com/angular-2-tutorial-for-beginners/") Angular 2 Jumpstart with Typescript
li
a(class="title text-body" href="https://www.udemy.com/angular-2-fundamentals/") Angular 2 Fundamentals
li
a(class="title text-body" href="https://www.udemy.com/angular-2-master-class-with-alejandro-rangel/") Angular 2 Master Class
li
a(class="title text-body" href="https://www.udemy.com/introduction-to-angular2/") Angular 2 Demystified
h3 egghead.io
ul(class="publisher")
li
a(class="title text-body" href="https://egghead.io/technologies/angular2") Angular 2 videos
h3 Workshops & Onsite Training Vendors
ul(class="publisher")
li
a(class="title text-body" href="http://rangle.io/services/javascript-training/angular2-training/") Rangle.io
li
a(class="title text-body" href="http://oasisdigital.com/training") Oasis Digital
li
a(class="title text-body" href="http://thoughtram.io/") Thoughtram
div
h1 Tooling and Libraries
div(class="resources")
h3 Tooling
ul
li
a(class="text-body" href="https://augury.rangle.io/") Augury
li
a(class="text-body" href="https://github.com/angular/universal") Angular Universal
li
a(class="text-body" href="https://github.com/johnpapa/lite-server") Lite-server
li
a(class="text-body" href="https://github.com/mgechev/codelyzer") Codelyzer
h3 IDEs
ul
li
a(class="text-body" href="http://code.visualstudio.com/") Visual Studio Code
li
a(class="text-body" href="https://www.jetbrains.com/webstorm/") WebStorm
li
a(class="text-body" href="https://www.jetbrains.com/idea/") IntelliJ IDEA
h3 Data Libraries
ul
li
a(class="text-body" href="https://www.firebase.com/") Firebase
li
a(class="text-body" href="https://www.meteor.com/") Meteor
li
a(class="text-body" href="http://mean.io/") MEAN
h3 UI Components
ul
li
a(class="text-body" href="https://github.com/angular/material2") Angular Material 2
li
a(class="text-body" href="http://www.primefaces.org/primeng/") Prime Faces
li
a(class="text-body" href="http://www.telerik.com/blogs/what-to-expect-in-2016-for-kendo-ui-with-angular-2-and-more") Kendo UI
li
a(class="text-body" href="http://ng-lightning.github.io/ng-lightning/") ng-lightening
li
a(class="text-body" href="http://wijmo.com/products/wijmo-5/") Wijmo
li
a(class="text-body" href="https://angular-ui.github.io/bootstrap/") Bootstrap UI
li
a(class="text-body" href="https://vaadin.com/home") Vaadin
h3 Cross-Platform Development
ul
li
a(class="text-body" href="https://github.com/NativeScript/nativescript-angular") NativeScript
li
a(class="text-body" href="http://angular.github.io/react-native-renderer/") React Native
li
a(class="text-body" href="http://ionicframework.com/docs/v2/") Ionic
li
a(class="text-body" href="http://github.com/angular/angular-electron") Electron
li
a(class="text-body" href="http://github.com/preboot/angular2-universal-windows-app") Windows (UWP)
div
h1 Communities
div(class="resources")
p(class="text-body") Would you like to be listed in this page? Fill out this <a href="https://docs.google.com/a/rangle.io/forms/d/1qzWaDpTgTPe4iPDRF_VCT9aHXKimUocwlFnVJUdKabY/viewform?c=0&w=1">form</a>.
h3 Podcasts
ul(class="podcasts")
li(class="podcast")
a(class="text-body" href="https://angularair.com/") AngularAir
li(class="podcast")
a(class="text-body" href="https://javascriptair.com/") JavaScript Air
li(class="podcast")
a(class="text-body" href="https://devchat.tv/adventures-in-angular") Adventures in Angular
h3 Communities
ul(class="communities")
li(class="community")
a(class="text-body" href="http://angularbeers.org/") Angular Beers
li(class="community")
a(class="text-body" href="http://angularcamp.org/") Angular Camp
li(class="community")
a(class="text-body" href="http://www.meetup.com/find/?allMeetups=false&keywords=angularjs&radius=Infinity&userFreeform=94043&gcResults=Mountain+View%2C+CA+94043%2C+USA%3AUS%3ACalifornia%3ASanta+Clara+County%3AMountain+View%3Anull%3A94043%3A37.428434%3A-122.07238159999997&change=yes&sort=default") Angular Meetups

54
public/books.jade
View File

@ -1,54 +0,0 @@
div(class="resources")
p(class="text-body") Would you like to be listed in this page? Fill out this <a href="https://docs.google.com/a/rangle.io/forms/d/1qzWaDpTgTPe4iPDRF_VCT9aHXKimUocwlFnVJUdKabY/viewform?c=0&w=1">form</a>.
h3 Packt Publishing
ul(class="publisher")
li(class="book")
a(class="title text-body" href="https://www.packtpub.com/web-development/switching-angular-2") Switching to Angular 2
li(class="book")
a(class="title text-body" href="https://www.packtpub.com/web-development/mastering-angular-2-components") Mastering Angular 2 Components
li(class="book")
a(class="title text-body" href="https://www.packtpub.com/web-development/angular-2-blueprints") Angular 2 Blueprints
li(class="book")
a(class="title text-body" href="https://www.packtpub.com/web-development/angular-2-example") Angular 2 By Examples
li(class="book")
a(class="title text-body" href="https://www.packtpub.com/web-development/mastering-angular-2-components") Angular 2 Components
li(class="book")
a(class="title text-body" href="https://www.packtpub.com/web-development/learning-angular-2-net-developers") Learning Angular 2 for .NET Developers
li(class="book")
a(class="title text-body" href="https://www.packtpub.com/web-development/angular-2-test-driven-development") Angular 2 Test-driven Development
h3 Manning Publications
ul(class="publisher")
li(class="book")
a(class="title text-body" href="https://www.manning.com/books/angular-2-in-action") Angular 2 In Action
li(class="book")
a(class="title text-body" href="https://www.manning.com/books/angular-2-development-with-typescript") Angular 2 Development with TypeScript
li(class="book")
a(class="title text-body" href="https://www.manning.com/books/testing-angular-2-applications") Testing Angular 2 Applications
h3 O'Reilly Media
ul(class="publisher")
li(class="book")
a(class="title text-body" href="http://www.oreilly.com/pub/e/3693") Angular 2 Web Development with TypeScript
li(class="book")
a(class="title text-body" href="http://shop.oreilly.com/product/0636920051824.do") Migrating to Angular 2
li(class="book")
a(class="title text-body" href="http://shop.oreilly.com/product/9781785886201.do") Switching to Angular 2
h3 Self-published
ul(class="publisher")
li(class="book")
a(class="title text-body" href="http://ngcourse.rangle.io/") Rangle.io: ngCourse 2
li(class="book")
a(class="title text-body" href="https://www.ng-book.com/2/") ng-book 2
li(class="book")
a(class="title text-body" href="https://leanpub.com/angular2-book") Angular 2 Book
li(class="book")
a(class="title text-body" href="https://books.ninja-squad.com/angular2") Become a ninja with Angular 2
li(class="book")
a(class="title text-body" href="https://leanpub.com/practical-angular-2") Practical Angular 2

26
public/communities.jade
View File

@ -1,26 +0,0 @@
div(class="resources")
p(class="text-body") Would you like to be listed in this page? Fill out this <a href="https://docs.google.com/a/rangle.io/forms/d/1qzWaDpTgTPe4iPDRF_VCT9aHXKimUocwlFnVJUdKabY/viewform?c=0&w=1">form</a>.
h3 Podcasts
ul(class="podcasts")
li(class="podcast")
a(class="text-body" href="https://angularair.com/") AngularAir
li(class="podcast")
a(class="text-body" href="https://javascriptair.com/") JavaScript Air
li(class="podcast")
a(class="text-body" href="https://devchat.tv/adventures-in-angular") Adventures in Angular
h3 Communities
ul(class="communities")
li(class="community")
a(class="text-body" href="http://angularbeers.org/") Angular Beers
li(class="community")
a(class="text-body" href="http://angularcamp.org/") Angular Camp
li(class="community")
a(class="text-body" href="http://www.meetup.com/find/?allMeetups=false&keywords=angularjs&radius=Infinity&userFreeform=94043&gcResults=Mountain+View%2C+CA+94043%2C+USA%3AUS%3ACalifornia%3ASanta+Clara+County%3AMountain+View%3Anull%3A94043%3A37.428434%3A-122.07238159999997&change=yes&sort=default") Angular Meetups

2
public/docs/_examples/.gitignore vendored
View File

@ -20,7 +20,7 @@ _test-output
_temp
**/ts/**/*.js
**/ts-snippets/**/*.js
**/ts/**/*.d.ts
*.d.ts
!**/*e2e-spec.js
!systemjs.config.1.js

6
public/docs/_examples/architecture/ts/app/app.component.ts
View File

@ -1,8 +1,8 @@
// #docregion import
import {Component} from '@angular/core';
import { Component } from '@angular/core';
// #enddocregion import
import {HeroListComponent} from './hero-list.component';
import {SalesTaxComponent} from './sales-tax.component';
import { HeroListComponent } from './hero-list.component';
import { SalesTaxComponent } from './sales-tax.component';
@Component({
selector: 'my-app',

13
public/docs/_examples/architecture/ts/app/backend.service.ts
View File

@ -1,6 +1,7 @@
import {Injectable, Type} from '@angular/core';
import {Logger} from './logger.service';
import {Hero} from './hero';
import { Injectable, Type } from '@angular/core';
import { Logger } from './logger.service';
import { Hero } from './hero';
const HEROES = [
new Hero('Windstorm', 'Weather mastery'),
@ -10,7 +11,7 @@ const HEROES = [
@Injectable()
export class BackendService {
constructor(private _logger: Logger) {}
constructor(private logger: Logger) {}
getAll(type:Type) : PromiseLike<any[]>{
if (type === Hero) {
@ -18,7 +19,7 @@ export class BackendService {
return Promise.resolve<Hero[]>(HEROES);
}
let err = new Error('Cannot get object of this type');
this._logger.error(err);
this.logger.error(err);
throw err;
}
}
}

5
public/docs/_examples/architecture/ts/app/hero-detail.component.ts
View File

@ -1,5 +1,6 @@
import {Component, Input} from '@angular/core';
import {Hero} from './hero';
import { Component, Input} from '@angular/core';
import { Hero } from './hero';
@Component({
selector: 'hero-detail',

13
public/docs/_examples/architecture/ts/app/hero-list.component.ts
View File

@ -1,8 +1,9 @@
// #docplaster
import {Component, OnInit} from '@angular/core';
import {Hero} from './hero';
import {HeroDetailComponent} from './hero-detail.component';
import {HeroService} from './hero.service';
import { Component, OnInit } from '@angular/core';
import { Hero } from './hero';
import { HeroDetailComponent } from './hero-detail.component';
import { HeroService } from './hero.service';
// #docregion metadata
// #docregion providers
@ -24,14 +25,14 @@ export class HeroesComponent { ... }
// #docregion class
export class HeroListComponent implements OnInit {
// #docregion ctor
constructor(private _service: HeroService) { }
constructor(private service: HeroService) { }
// #enddocregion ctor
heroes: Hero[];
selectedHero: Hero;
ngOnInit() {
this.heroes = this._service.getHeroes();
this.heroes = this.service.getHeroes();
}
selectHero(hero: Hero) { this.selectedHero = hero; }

23
public/docs/_examples/architecture/ts/app/hero.service.ts
View File

@ -1,25 +1,26 @@
import {Injectable} from '@angular/core';
import {Hero} from './hero';
import {BackendService} from './backend.service';
import {Logger} from './logger.service';
import { Injectable } from '@angular/core';
import { Hero } from './hero';
import { BackendService } from './backend.service';
import { Logger } from './logger.service';
@Injectable()
// #docregion class
export class HeroService {
// #docregion ctor
constructor(
private _backend: BackendService,
private _logger: Logger) { }
private backend: BackendService,
private logger: Logger) { }
// #enddocregion ctor
private _heroes: Hero[] = [];
private heroes: Hero[] = [];
getHeroes() {
this._backend.getAll(Hero).then( (heroes: Hero[]) => {
this._logger.log(`Fetched ${heroes.length} heroes.`);
this._heroes.push(...heroes); // fill cache
this.backend.getAll(Hero).then( (heroes: Hero[]) => {
this.logger.log(`Fetched ${heroes.length} heroes.`);
this.heroes.push(...heroes); // fill cache
});
return this._heroes;
return this.heroes;
}
}
// #enddocregion class

2
public/docs/_examples/architecture/ts/app/logger.service.ts
View File

@ -1,5 +1,5 @@
// #docregion
import {Injectable} from '@angular/core';
import { Injectable } from '@angular/core';
@Injectable()
// #docregion class

10
public/docs/_examples/architecture/ts/app/main.ts
View File

@ -1,10 +1,10 @@
import {bootstrap} from '@angular/platform-browser-dynamic';
import { bootstrap } from '@angular/platform-browser-dynamic';
// #docregion import
import {AppComponent} from './app.component';
import { AppComponent } from './app.component';
// #enddocregion import
import {HeroService} from './hero.service';
import {BackendService} from './backend.service';
import {Logger} from './logger.service';
import { HeroService } from './hero.service';
import { BackendService } from './backend.service';
import { Logger } from './logger.service';
// #docregion bootstrap
bootstrap(AppComponent, [BackendService, HeroService, Logger]);

13
public/docs/_examples/architecture/ts/app/sales-tax.component.ts
View File

@ -1,8 +1,9 @@
// #docplaster
// #docregion
import {Component} from '@angular/core';
import {SalesTaxService} from './sales-tax.service';
import {TaxRateService} from './tax-rate.service';
import { Component } from '@angular/core';
import { SalesTaxService } from './sales-tax.service';
import { TaxRateService } from './tax-rate.service';
// #docregion metadata
// #docregion providers
@ -12,7 +13,7 @@ import {TaxRateService} from './tax-rate.service';
template: `
<h2>Sales Tax Calculator</h2>
Amount: <input #amountBox (change)="0">
<div *ngIf="amountBox.value">
The sales tax is
{{ getTax(amountBox.value) | currency:'USD':true:'1.2-2' }}
@ -31,11 +32,11 @@ export class SalesTaxComponent { ... }
// #docregion class
export class SalesTaxComponent {
// #docregion ctor
constructor(private _salesTaxService: SalesTaxService) { }
constructor(private salesTaxService: SalesTaxService) { }
// #enddocregion ctor
getTax(value:string | number){
return this._salesTaxService.getVAT(value);
return this.salesTaxService.getVAT(value);
}
}
// #enddocregion class

11
public/docs/_examples/architecture/ts/app/sales-tax.service.ts
View File

@ -1,11 +1,12 @@
// #docregion
import {Injectable, Inject} from '@angular/core';
import {TaxRateService} from './tax-rate.service';
import { Inject, Injectable } from '@angular/core';
import { TaxRateService } from './tax-rate.service';
// #docregion class
@Injectable()
export class SalesTaxService {
constructor(private _rateService: TaxRateService) { }
constructor(private rateService: TaxRateService) { }
getVAT(value:string | number){
let amount:number;
if (typeof value === "string"){
@ -13,7 +14,7 @@ export class SalesTaxService {
} else {
amount = value;
}
return (amount || 0) * this._rateService.getRate('VAT');
return (amount || 0) * this.rateService.getRate('VAT');
}
}
// #enddocregion class
// #enddocregion class

4
public/docs/_examples/architecture/ts/app/tax-rate.service.ts
View File

@ -1,9 +1,9 @@
// #docregion
import {Injectable} from '@angular/core';
import { Injectable } from '@angular/core';
// #docregion class
@Injectable()
export class TaxRateService {
getRate(rateName:string){return 0.10;} // always 10% everywhere
}
// #enddocregion class
// #enddocregion class

2
public/docs/_examples/architecture/ts/index.html
View File

@ -15,7 +15,7 @@
<script src="systemjs.config.js"></script>
<script>
System.import('app').catch(function(err){ console.error(err); });
System.import('app').catch(function(err){ console.error(err); });
</script>
</head>

2
public/docs/_examples/attribute-directives/dart/lib/app_component.dart
View File

@ -6,7 +6,7 @@ import 'highlight_directive.dart';
@Component(
selector: 'my-app',
templateUrl: 'app_component.html',
directives: const [Highlight])
directives: const [HighlightDirective])
class AppComponent {
String color;
}

10
public/docs/_examples/attribute-directives/dart/lib/app_component.html
View File

@ -7,14 +7,14 @@
<input type="radio" name="colors" (click)="color='yellow'">Yellow
<input type="radio" name="colors" (click)="color='cyan'">Cyan
</div>
<!-- #docregion span -->
<p><span [my-highlight]="color">Highlight me!</span></p>
<!-- #enddocregion span -->
<!-- #docregion pHost -->
<p [myHighlight]="color">Highlight me!</p>
<!-- #enddocregion pHost -->
<!-- #enddocregion v2 -->
<!-- #docregion defaultColor -->
<p><span [my-highlight]="color" [default-color]="'violet'">
<p [myHighlight]="color" [defaultColor]="'violet'">
Highlight me too!
</span></p>
</p>
<!-- #enddocregion defaultColor -->
<!-- #enddocregion -->

6
public/docs/_examples/attribute-directives/dart/lib/app_component_1.html
View File

@ -1,3 +1,7 @@
<!-- #docregion -->
<h1>My First Attribute Directive</h1>
<span my-highlight>Highlight me!</span>
<p myHighlight>Highlight me!</p>
<!-- #enddocregion -->
<!-- #docregion p-style-background -->
<p [style.background]="'lime'">I am green with envy!</p>
<!-- #enddocregion p-style-background -->

53
public/docs/_examples/attribute-directives/dart/lib/highlight_directive.dart
View File

@ -2,51 +2,42 @@
// #docregion full
import 'package:angular2/core.dart';
@Directive(selector: '[my-highlight]', host: const {
@Directive(selector: '[myHighlight]', host: const {
'(mouseenter)': 'onMouseEnter()',
'(mouseleave)': 'onMouseLeave()'
})
// #docregion class-1
class Highlight {
// #enddocregion class-1
// #enddocregion full
/*
// #docregion highlight
@Input() myHighlight: string;
// #enddocregion highlight
*/
// #docregion full
// #docregion class-1
// #docregion color
@Input('my-highlight') String highlightColor;
// #enddocregion color
class HighlightDirective {
String _defaultColor = 'red';
final dynamic _el;
HighlightDirective(ElementRef elRef) : _el = elRef.nativeElement;
// #enddocregion class-1
// #docregion defaultColor
@Input() set defaultColor(String colorName) {
_defaultColor = (colorName ?? _defaultColor);
}
// #enddocregion defaultColor
// #docregion class-1
// #docregion class-1
final ElementRef _element;
// #docregion color
@Input('myHighlight') String highlightColor;
// #enddocregion color
// #docregion mouse-enter
void onMouseEnter() { _highlight(highlightColor ?? _defaultColor); }
// #enddocregion mouse-enter
void onMouseLeave() { _highlight(); }
// #docregion mouse-enter
onMouseEnter() {
_highlight(highlightColor ?? _defaultColor);
void _highlight([String color]) {
if(_el != null) _el.style.backgroundColor = color;
}
// #enddocregion mouse-enter
onMouseLeave() {
_highlight(null);
}
void _highlight(String color) {
_element.nativeElement.style.backgroundColor = color;
}
Highlight(this._element);
}
// #enddocregion class-1
// #enddocregion full
/*
// #docregion highlight
@Input() String myHighlight;
// #enddocregion highlight
*/

6
public/docs/_examples/attribute-directives/dart/lib/highlight_directive_1.dart
View File

@ -3,9 +3,9 @@ library attribute_directives.highlight_directive;
import 'package:angular2/core.dart';
@Directive(selector: '[my-highlight]')
class Highlight {
Highlight(ElementRef element) {
@Directive(selector: '[myHighlight]')
class HighlightDirective {
HighlightDirective(ElementRef element) {
element.nativeElement.style.backgroundColor = 'yellow';
}
}

36
public/docs/_examples/attribute-directives/dart/lib/highlight_directive_2.dart
View File

@ -1,32 +1,28 @@
// #docregion
import 'package:angular2/core.dart';
@Directive(selector: '[my-highlight]',
// #docregion host
@Directive(selector: '[myHighlight]',
// #docregion host
host: const {
'(mouseenter)': 'onMouseEnter()',
'(mouseleave)': 'onMouseLeave()'
}
// #enddocregion host
)
class Highlight {
final ElementRef _element;
// #docregion mouse-methods
onMouseEnter() {
_highlight("yellow");
}
// #enddocregion host
)
class HighlightDirective {
// #docregion ctor
final dynamic _el;
onMouseLeave() {
_highlight(null);
HighlightDirective(ElementRef elRef) : _el = elRef.nativeElement;
// #enddocregion ctor
// #docregion mouse-methods
void onMouseEnter() { _highlight("yellow"); }
void onMouseLeave() { _highlight(); }
void _highlight([String color]) {
if (_el != null) _el.style.backgroundColor = color;
}
// #enddocregion mouse-methods
void _highlight(String color) {
_element.nativeElement.style.backgroundColor = color;
}
// #docregion ctor
Highlight(this._element);
// #enddocregion ctor
}
// #enddocregion

7
public/docs/_examples/attribute-directives/ts/app/app.component.1.html
View File

@ -1,4 +1,7 @@
<!-- #docregion -->
<h1>My First Attribute Directive</h1>
<span myHighlight>Highlight me!</span>
<!-- #enddocregion -->
<p myHighlight>Highlight me!</p>
<!-- #enddocregion -->
<!-- #docregion p-style-background -->
<p [style.background]="'lime'">I am green with envy!</p>
<!-- #enddocregion p-style-background -->

8
public/docs/_examples/attribute-directives/ts/app/app.component.html
View File

@ -7,10 +7,9 @@
<input type="radio" name="colors" (click)="color='yellow'">Yellow
<input type="radio" name="colors" (click)="color='cyan'">Cyan
</div>
<!-- #docregion span -->
<!-- #docregion pHost -->
<p [myHighlight]="color">Highlight me!</p>
<!-- #enddocregion span -->
<!-- #enddocregion pHost -->
<!-- #enddocregion v2 -->
<!-- #docregion defaultColor -->
@ -18,5 +17,4 @@
Highlight me too!
</p>
<!-- #enddocregion defaultColor -->
<!-- #enddocregion -->
<!-- #enddocregion -->

5
public/docs/_examples/attribute-directives/ts/app/app.component.ts
View File

@ -1,6 +1,7 @@
// #docregion
import {Component} from '@angular/core';
import {HighlightDirective} from './highlight.directive';
import { Component } from '@angular/core';
import { HighlightDirective } from './highlight.directive';
@Component({
selector: 'my-app',

8
public/docs/_examples/attribute-directives/ts/app/highlight.directive.1.ts
View File

@ -1,13 +1,9 @@
// #docregion
import {Directive, ElementRef, Input} from '@angular/core';
@Directive({
selector: '[myHighlight]'
})
import { Directive, ElementRef, Input } from '@angular/core';
@Directive({ selector: '[myHighlight]' })
export class HighlightDirective {
constructor(el: ElementRef) {
el.nativeElement.style.backgroundColor = 'yellow';
}
}
// #enddocregion

18
public/docs/_examples/attribute-directives/ts/app/highlight.directive.2.ts
View File

@ -1,5 +1,5 @@
// #docregion
import {Directive, ElementRef, Input} from '@angular/core';
import { Directive, ElementRef, Input } from '@angular/core';
@Directive({
selector: '[myHighlight]',
@ -12,20 +12,20 @@ import {Directive, ElementRef, Input} from '@angular/core';
})
export class HighlightDirective {
// #docregion ctor
private _el:HTMLElement;
constructor(el: ElementRef) { this._el = el.nativeElement; }
private el:HTMLElement;
constructor(el: ElementRef) { this.el = el.nativeElement; }
// #enddocregion ctor
// #docregion mouse-methods
onMouseEnter() { this._highlight("yellow"); }
onMouseLeave() { this._highlight(null); }
onMouseEnter() { this.highlight("yellow"); }
onMouseLeave() { this.highlight(null); }
private _highlight(color: string) {
this._el.style.backgroundColor = color;
private highlight(color: string) {
this.el.style.backgroundColor = color;
}
// #enddocregion mouse-methods
}
// #enddocregion
// #enddocregion

50
public/docs/_examples/attribute-directives/ts/app/highlight.directive.ts
View File

@ -1,6 +1,6 @@
// #docplaster
// #docregion full
import {Directive, ElementRef, Input} from '@angular/core';
import { Directive, ElementRef, Input } from '@angular/core';
@Directive({
selector: '[myHighlight]',
@ -9,44 +9,38 @@ import {Directive, ElementRef, Input} from '@angular/core';
'(mouseleave)': 'onMouseLeave()'
}
})
// #docregion class-1
export class HighlightDirective {
private _defaultColor = 'red';
private _el:HTMLElement;
// #enddocregion class-1
// #enddocregion full
/*
// #docregion highlight
@Input() myHighlight: string;
// #enddocregion highlight
*/
// #docregion full
private el: HTMLElement;
constructor(el: ElementRef) { this.el = el.nativeElement; }
// #enddocregion class-1
// #docregion defaultColor
// #docregion defaultColor
@Input() set defaultColor(colorName:string){
this._defaultColor = colorName || this._defaultColor;
}
// #enddocregion defaultColor
// #docregion class-1
// #enddocregion defaultColor
// #docregion class-1
// #docregion color
// #docregion color
@Input('myHighlight') highlightColor: string;
// #enddocregion color
// #enddocregion color
// #enddocregion class-1
// #docregion class-1
constructor(el: ElementRef) { this._el = el.nativeElement; }
// #docregion mouse-enter
onMouseEnter() { this.highlight(this.highlightColor || this._defaultColor); }
// #enddocregion mouse-enter
onMouseLeave() { this.highlight(null); }
// #docregion mouse-enter
onMouseEnter() { this._highlight(this.highlightColor || this._defaultColor); }
// #enddocregion mouse-enter
onMouseLeave() { this._highlight(null); }
private _highlight(color:string) {
this._el.style.backgroundColor = color;
private highlight(color:string) {
this.el.style.backgroundColor = color;
}
}
// #enddocregion class-1
// #enddocregion full
// #enddocregion full
/*
// #docregion highlight
@Input() myHighlight: string;
// #enddocregion highlight
*/

6
public/docs/_examples/attribute-directives/ts/app/main.ts
View File

@ -1,5 +1,7 @@
// #docregion
import {bootstrap} from '@angular/platform-browser-dynamic';
import {AppComponent} from './app.component';
import { bootstrap } from '@angular/platform-browser-dynamic';
import { AppComponent } from './app.component';
bootstrap(AppComponent);

5
public/docs/_examples/attribute-directives/ts/index.html
View File

@ -16,13 +16,10 @@
<script src="systemjs.config.js"></script>
<script>
System.import('app').catch(function(err){ console.error(err); });
System.import('app').catch(function(err){ console.error(err); });
</script>
</head>
<body>
<my-app>loading...</my-app>
</body>
</html>

12
public/docs/_examples/cb-a1-a2-quick-reference/ts/app/app.component.ts
View File

@ -1,10 +1,10 @@
import {Component} from '@angular/core';
import {RouteConfig, ROUTER_DIRECTIVES, ROUTER_PROVIDERS} from '@angular/router-deprecated';
import { Component } from '@angular/core';
import { RouteConfig, ROUTER_DIRECTIVES, ROUTER_PROVIDERS } from '@angular/router-deprecated';
import {MovieListComponent} from './movie-list.component';
import {MovieService} from './movie.service';
import {IMovie} from './movie';
import {StringSafeDatePipe} from './date.pipe';
import { MovieListComponent } from './movie-list.component';
import { MovieService } from './movie.service';
import { IMovie } from './movie';
import { StringSafeDatePipe } from './date.pipe';
@Component({
selector: 'my-app',

4
public/docs/_examples/cb-a1-a2-quick-reference/ts/app/date.pipe.ts
View File

@ -1,5 +1,5 @@
import {Injectable, Pipe} from '@angular/core';
import {DatePipe} from '@angular/common';
import { Injectable, Pipe } from '@angular/core';
import { DatePipe } from '@angular/common';
@Injectable()
// #docregion date-pipe

5
public/docs/_examples/cb-a1-a2-quick-reference/ts/app/main.ts
View File

@ -1,5 +1,6 @@
// #docregion
import {bootstrap} from '@angular/platform-browser-dynamic';
import {AppComponent} from './app.component';
import { bootstrap } from '@angular/platform-browser-dynamic';
import { AppComponent } from './app.component';
bootstrap(AppComponent);

10
public/docs/_examples/cb-a1-a2-quick-reference/ts/app/movie-list.component.ts
View File

@ -1,11 +1,11 @@
// #docplaster
// #docregion import
import {Component} from '@angular/core';
import {ROUTER_DIRECTIVES} from '@angular/router-deprecated';
import { Component } from '@angular/core';
import { ROUTER_DIRECTIVES } from '@angular/router-deprecated';
// #enddocregion import
import {MovieService} from './movie.service';
import {IMovie} from './movie';
import {StringSafeDatePipe} from './date.pipe';
import { MovieService } from './movie.service';
import { IMovie } from './movie';
import { StringSafeDatePipe } from './date.pipe';
// #docregion component

5
public/docs/_examples/cb-a1-a2-quick-reference/ts/app/movie.service.ts
View File

@ -1,5 +1,6 @@
import {Injectable} from '@angular/core';
import {IMovie} from './movie';
import { Injectable } from '@angular/core';
import { IMovie } from './movie';
@Injectable()
export class MovieService {

2
public/docs/_examples/cb-a1-a2-quick-reference/ts/index.html
View File

@ -18,7 +18,7 @@
<script src="systemjs.config.js"></script>
<script>
System.import('app').catch(function(err){ console.error(err); });
System.import('app').catch(function(err){ console.error(err); });
</script>
</head>

17
public/docs/_examples/cb-component-communication/ts/app/app.component.ts
View File

@ -1,11 +1,12 @@
import {Component} from '@angular/core';
import {HeroParentComponent} from './hero-parent.component';
import {NameParentComponent} from './name-parent.component';
import {VersionParentComponent} from './version-parent.component';
import {VoteTakerComponent} from './votetaker.component';
import {CountdownLocalVarParentComponent,
CountdownViewChildParentComponent} from './countdown-parent.component';
import {MissionControlComponent} from './missioncontrol.component';
import { Component } from '@angular/core';
import { HeroParentComponent } from './hero-parent.component';
import { NameParentComponent } from './name-parent.component';
import { VersionParentComponent } from './version-parent.component';
import { VoteTakerComponent } from './votetaker.component';
import { CountdownLocalVarParentComponent,
CountdownViewChildParentComponent } from './countdown-parent.component';
import { MissionControlComponent } from './missioncontrol.component';
@Component({
selector: 'app',

7
public/docs/_examples/cb-component-communication/ts/app/astronaut.component.ts
View File

@ -1,7 +1,8 @@
// #docregion
import {Component, Input, OnDestroy} from '@angular/core';
import {MissionService} from './mission.service';
import {Subscription} from 'rxjs/Subscription';
import { Component, Input, OnDestroy } from '@angular/core';
import { MissionService } from './mission.service';
import { Subscription } from 'rxjs/Subscription';
@Component({
selector: 'my-astronaut',

14
public/docs/_examples/cb-component-communication/ts/app/countdown-parent.component.ts
View File

@ -1,9 +1,9 @@
// #docplaster
// #docregion vc
import {AfterViewInit, ViewChild} from '@angular/core';
import { AfterViewInit, ViewChild } from '@angular/core';
// #docregion lv
import {Component} from '@angular/core';
import {CountdownTimerComponent} from './countdown-timer.component';
import { Component } from '@angular/core';
import { CountdownTimerComponent } from './countdown-timer.component';
// #enddocregion lv
// #enddocregion vc
@ -42,7 +42,7 @@ export class CountdownLocalVarParentComponent { }
export class CountdownViewChildParentComponent implements AfterViewInit {
@ViewChild(CountdownTimerComponent)
private _timerComponent:CountdownTimerComponent;
private timerComponent:CountdownTimerComponent;
seconds() { return 0; }
@ -50,10 +50,10 @@ export class CountdownViewChildParentComponent implements AfterViewInit {
// Redefine `seconds()` to get from the `CountdownTimerComponent.seconds` ...
// but wait a tick first to avoid one-time devMode
// unidirectional-data-flow-violation error
setTimeout(() => this.seconds = () => this._timerComponent.seconds, 0)
setTimeout(() => this.seconds = () => this.timerComponent.seconds, 0)
}
start(){ this._timerComponent.start(); }
stop() { this._timerComponent.stop(); }
start(){ this.timerComponent.start(); }
stop() { this.timerComponent.stop(); }
}
// #enddocregion vc

8
public/docs/_examples/cb-component-communication/ts/app/countdown-timer.component.ts
View File

@ -1,5 +1,5 @@
// #docregion
import {Component, OnInit, OnDestroy} from '@angular/core';
import { Component, OnDestroy, OnInit } from '@angular/core';
@Component({
selector:'countdown-timer',
@ -16,13 +16,13 @@ export class CountdownTimerComponent implements OnInit, OnDestroy {
ngOnInit() { this.start(); }
ngOnDestroy() { this.clearTimer(); }
start() { this._countDown(); }
start() { this.countDown(); }
stop() {
this.clearTimer();
this.message = `Holding at T-${this.seconds} seconds`;
}
private _countDown() {
private countDown() {
this.clearTimer();
this.intervalId = setInterval(()=>{
this.seconds -= 1;
@ -34,4 +34,4 @@ export class CountdownTimerComponent implements OnInit, OnDestroy {
}
}, 1000);
}
}
}

5
public/docs/_examples/cb-component-communication/ts/app/hero-child.component.ts
View File

@ -1,6 +1,7 @@
// #docregion
import {Component, Input} from '@angular/core';
import {Hero} from './hero';
import { Component, Input } from '@angular/core';
import { Hero } from './hero';
@Component({
selector: 'hero-child',

7
public/docs/_examples/cb-component-communication/ts/app/hero-parent.component.ts
View File

@ -1,7 +1,8 @@
// #docregion
import {Component} from '@angular/core';
import {HeroChildComponent} from './hero-child.component';
import {HEROES} from './hero';
import { Component } from '@angular/core';
import { HeroChildComponent } from './hero-child.component';
import { HEROES } from './hero';
@Component({
selector: 'hero-parent',

5
public/docs/_examples/cb-component-communication/ts/app/main.ts
View File

@ -1,4 +1,5 @@
import {bootstrap} from '@angular/platform-browser-dynamic';
import {AppComponent} from './app.component';
import { bootstrap } from '@angular/platform-browser-dynamic';
import { AppComponent } from './app.component';
bootstrap(AppComponent);

16
public/docs/_examples/cb-component-communication/ts/app/mission.service.ts
View File

@ -1,25 +1,25 @@
// #docregion
import {Injectable} from '@angular/core'
import {Subject} from 'rxjs/Subject';
import { Injectable } from '@angular/core'
import { Subject } from 'rxjs/Subject';
@Injectable()
export class MissionService {
// Observable string sources
private _missionAnnouncedSource = new Subject<string>();
private _missionConfirmedSource = new Subject<string>();
private missionAnnouncedSource = new Subject<string>();
private missionConfirmedSource = new Subject<string>();
// Observable string streams
missionAnnounced$ = this._missionAnnouncedSource.asObservable();
missionConfirmed$ = this._missionConfirmedSource.asObservable();
missionAnnounced$ = this.missionAnnouncedSource.asObservable();
missionConfirmed$ = this.missionConfirmedSource.asObservable();
// Service message commands
announceMission(mission: string) {
this._missionAnnouncedSource.next(mission)
this.missionAnnouncedSource.next(mission)
}
confirmMission(astronaut: string) {
this._missionConfirmedSource.next(astronaut);
this.missionConfirmedSource.next(astronaut);
}
}
// #enddocregion

9
public/docs/_examples/cb-component-communication/ts/app/missioncontrol.component.ts
View File

@ -1,7 +1,8 @@
// #docregion
import {Component} from '@angular/core';
import {AstronautComponent} from './astronaut.component';
import {MissionService} from './mission.service';
import { Component } from '@angular/core';
import { AstronautComponent } from './astronaut.component';
import { MissionService } from './mission.service';
@Component({
selector: 'mission-control',
@ -41,4 +42,4 @@ export class MissionControlComponent {
if (this.nextMission >= this.missions.length) { this.nextMission = 0; }
}
}
// #enddocregion
// #enddocregion

2
public/docs/_examples/cb-component-communication/ts/app/name-child.component.ts
View File

@ -1,5 +1,5 @@
// #docregion
import {Component, Input} from '@angular/core';
import { Component, Input } from '@angular/core';
@Component({
selector: 'name-child',

5
public/docs/_examples/cb-component-communication/ts/app/name-parent.component.ts
View File

@ -1,6 +1,7 @@
// #docregion
import {Component} from '@angular/core';
import {NameChildComponent} from './name-child.component';
import { Component } from '@angular/core';
import { NameChildComponent } from './name-child.component';
@Component({
selector: 'name-parent',

2
public/docs/_examples/cb-component-communication/ts/app/version-child.component.ts
View File

@ -1,6 +1,6 @@
/* tslint:disable:forin */
// #docregion
import {Component, Input, OnChanges, SimpleChange} from '@angular/core';
import { Component, Input, OnChanges, SimpleChange } from '@angular/core';
@Component({
selector: 'version-child',

5
public/docs/_examples/cb-component-communication/ts/app/version-parent.component.ts
View File

@ -1,6 +1,7 @@
// #docregion
import {Component} from '@angular/core';
import {VersionChildComponent} from './version-child.component';
import { Component } from '@angular/core';
import { VersionChildComponent } from './version-child.component';
@Component({
selector: 'version-parent',

2
public/docs/_examples/cb-component-communication/ts/app/voter.component.ts
View File

@ -1,5 +1,5 @@
// #docregion
import {Component, EventEmitter, Input, Output} from '@angular/core';
import { Component, EventEmitter, Input, Output } from '@angular/core';
@Component({
selector: 'my-voter',

5
public/docs/_examples/cb-component-communication/ts/app/votetaker.component.ts
View File

@ -1,6 +1,7 @@
// #docregion
import {Component} from '@angular/core';
import {VoterComponent} from './voter.component';
import { Component } from '@angular/core';
import { VoterComponent } from './voter.component';
@Component({
selector: 'vote-taker',

2
public/docs/_examples/cb-component-communication/ts/index.html
View File

@ -18,7 +18,7 @@
<script src="systemjs.config.js"></script>
<script>
System.import('app').catch(function(err){ console.error(err); });
System.import('app').catch(function(err){ console.error(err); });
</script>
</head>

1
public/docs/_examples/cb-dependency-injection/ts/app/date-logger.service.ts
View File

@ -1,6 +1,7 @@
/* tslint:disable:one-line:check-open-brace*/
// #docregion
import { Injectable } from '@angular/core';
import { LoggerService } from './logger.service';
// #docregion minimal-logger

12
public/docs/_examples/cb-dependency-injection/ts/app/hero-bio.component.ts
View File

@ -1,8 +1,8 @@
// #docregion
import {Component, Input, OnInit} from '@angular/core';
import { Component, Input, OnInit } from '@angular/core';
import {Hero} from './hero';
import {HeroCacheService} from './hero-cache.service';
import { Hero } from './hero';
import { HeroCacheService } from './hero-cache.service';
// #docregion component
@Component({
@ -20,10 +20,10 @@ export class HeroBioComponent implements OnInit {
@Input() heroId:number;
constructor(private _heroCache:HeroCacheService) { }
constructor(private heroCache:HeroCacheService) { }
ngOnInit() { this._heroCache.fetchCachedHero(this.heroId); }
ngOnInit() { this.heroCache.fetchCachedHero(this.heroId); }
get hero() { return this._heroCache.hero; }
get hero() { return this.heroCache.hero; }
}
// #enddocregion component

11
public/docs/_examples/cb-dependency-injection/ts/app/hero-cache.service.ts
View File

@ -1,17 +1,18 @@
// #docregion
import {Injectable} from '@angular/core';
import {Hero} from './hero';
import {HeroService} from './hero.service';
import { Injectable } from '@angular/core';
import { Hero } from './hero';
import { HeroService } from './hero.service';
// #docregion service
@Injectable()
export class HeroCacheService {
hero:Hero;
constructor(private _heroService:HeroService){}
constructor(private heroService:HeroService){}
fetchCachedHero(id:number){
if (!this.hero) {
this.hero = this._heroService.getHeroById(id);
this.hero = this.heroService.getHeroById(id);
}
return this.hero
}

17
public/docs/_examples/cb-dependency-injection/ts/app/hero-contact.component.ts
View File

@ -1,8 +1,9 @@
// #docplaster
// #docregion
import {Component, ElementRef, Host, Inject, Optional} from '@angular/core';
import {HeroCacheService} from './hero-cache.service';
import {LoggerService} from './logger.service';
import { Component, ElementRef, Host, Inject, Optional } from '@angular/core';
import { HeroCacheService } from './hero-cache.service';
import { LoggerService } from './logger.service';
// #docregion component
@Component({
@ -18,22 +19,22 @@ export class HeroContactComponent {
constructor(
// #docregion ctor-params
@Host() // limit to the host component's instance of the HeroCacheService
private _heroCache: HeroCacheService,
private heroCache: HeroCacheService,
@Host() // limit search for logger; hides the application-wide logger
@Optional() // ok if the logger doesn't exist
private _loggerService: LoggerService
private loggerService: LoggerService
// #enddocregion ctor-params
) {
if (_loggerService) {
if (loggerService) {
this.hasLogger = true;
_loggerService.logInfo('HeroContactComponent can log!');
loggerService.logInfo('HeroContactComponent can log!');
}
// #docregion ctor
}
// #enddocregion ctor
get phoneNumber() { return this._heroCache.hero.phone; }
get phoneNumber() { return this.heroCache.hero.phone; }
}
// #enddocregion component

2
public/docs/_examples/cb-dependency-injection/ts/app/hero-data.ts
View File

@ -1,5 +1,5 @@
// #docregion
import {Hero} from './hero';
import { Hero } from './hero';
export class HeroData {
createDb() {

2
public/docs/_examples/cb-dependency-injection/ts/app/hero-of-the-month.component.ts
View File

@ -1,7 +1,7 @@
/* tslint:disable:one-line:check-open-brace*/
// #docplaster
// #docregion opaque-token
import {OpaqueToken} from '@angular/core';
import { OpaqueToken } from '@angular/core';
export const TITLE = new OpaqueToken('title');
// #enddocregion opaque-token

10
public/docs/_examples/cb-dependency-injection/ts/app/hero.service.ts
View File

@ -1,22 +1,22 @@
// #docregion
import {Injectable} from '@angular/core';
import {Hero} from './hero';
import { Injectable } from '@angular/core';
import { Hero } from './hero';
@Injectable()
export class HeroService {
//TODO move to database
private _heroes:Array<Hero> = [
private heroes:Array<Hero> = [
new Hero(1, 'RubberMan','Hero of many talents', '123-456-7899'),
new Hero(2, 'Magma','Hero of all trades', '555-555-5555'),
new Hero(3, 'Mr. Nice','The name says it all','111-222-3333')
];
getHeroById(id:number):Hero{
return this._heroes.filter(hero => hero.id === id)[0];
return this.heroes.filter(hero => hero.id === id)[0];
}
getAllHeroes():Array<Hero>{
return this._heroes;
return this.heroes;
}
}

14
public/docs/_examples/cb-dependency-injection/ts/app/highlight.directive.ts
View File

@ -1,6 +1,6 @@
// #docplaster
// #docregion
import {Directive, ElementRef, Input} from '@angular/core';
import { Directive, ElementRef, Input } from '@angular/core';
@Directive({
selector: '[myHighlight]',
@ -13,16 +13,16 @@ export class HighlightDirective {
@Input('myHighlight') highlightColor: string;
private _el: HTMLElement;
private el: HTMLElement;
constructor(el: ElementRef) {
this._el = el.nativeElement;
this.el = el.nativeElement;
}
onMouseEnter() { this._highlight(this.highlightColor || 'cyan'); }
onMouseLeave() { this._highlight(null); }
onMouseEnter() { this.highlight(this.highlightColor || 'cyan'); }
onMouseLeave() { this.highlight(null); }
private _highlight(color: string) {
this._el.style.backgroundColor = color;
private highlight(color: string) {
this.el.style.backgroundColor = color;
}
}

2
public/docs/_examples/cb-dependency-injection/ts/app/logger.service.ts
View File

@ -1,5 +1,5 @@
// #docregion
import {Injectable} from '@angular/core';
import { Injectable } from '@angular/core';
@Injectable()
export class LoggerService {

2
public/docs/_examples/cb-dependency-injection/ts/app/main.ts
View File

@ -2,9 +2,7 @@
import { bootstrap } from '@angular/platform-browser-dynamic';
import { provide } from '@angular/core';
import { XHRBackend } from '@angular/http';
import { ROUTER_PROVIDERS } from '@angular/router-deprecated';
import { LocationStrategy,
HashLocationStrategy } from '@angular/common';

7
public/docs/_examples/cb-dependency-injection/ts/app/runners-up.ts
View File

@ -1,8 +1,9 @@
// #docplaster
// #docregion
import {OpaqueToken} from '@angular/core';
import {Hero} from './hero';
import {HeroService} from './hero.service';
import { OpaqueToken } from '@angular/core';
import { Hero } from './hero';
import { HeroService } from './hero.service';
// #docregion runners-up
export const RUNNERS_UP = new OpaqueToken('RunnersUp');

17
public/docs/_examples/cb-dependency-injection/ts/app/sorted-heroes.component.ts
View File

@ -1,8 +1,9 @@
// #docplaster
// #docregion
import {Component, OnInit} from '@angular/core';
import {Hero} from './hero';
import {HeroService} from './hero.service';
import { Component, OnInit } from '@angular/core';
import { Hero } from './hero';
import { HeroService } from './hero.service';
/////// HeroesBaseComponent /////
// #docregion heroes-base, injection
@ -12,18 +13,18 @@ import {HeroService} from './hero.service';
providers: [HeroService]
})
export class HeroesBaseComponent implements OnInit {
constructor(private _heroService: HeroService) { }
constructor(private heroService: HeroService) { }
// #enddocregion injection
heroes: Array<Hero>;
ngOnInit() {
this.heroes = this._heroService.getAllHeroes();
this._afterGetHeroes();
this.heroes = this.heroService.getAllHeroes();
this.afterGetHeroes();
}
// Post-process heroes in derived class override.
protected _afterGetHeroes() {}
protected afterGetHeroes() {}
// #docregion injection
}
@ -41,7 +42,7 @@ export class SortedHeroesComponent extends HeroesBaseComponent {
super(heroService);
}
protected _afterGetHeroes() {
protected afterGetHeroes() {
this.heroes = this.heroes.sort((h1, h2) => {
return h1.name < h2.name ? -1 :
(h1.name > h2.name ? 1 : 0);

13
public/docs/_examples/cb-dependency-injection/ts/app/user-context.service.ts
View File

@ -1,8 +1,9 @@
// #docplaster
// #docregion
import {Injectable} from '@angular/core';
import {LoggerService} from './logger.service';
import {UserService} from './user.service';
import { Injectable } from '@angular/core';
import { LoggerService } from './logger.service';
import { UserService } from './user.service';
// #docregion injectables, injectable
@Injectable()
@ -13,7 +14,7 @@ export class UserContextService {
loggedInSince:Date;
// #docregion ctor, injectables
constructor(private _userService:UserService, private _loggerService:LoggerService){
constructor(private userService:UserService, private loggerService:LoggerService){
// #enddocregion ctor, injectables
this.loggedInSince = new Date();
// #docregion ctor, injectables
@ -21,11 +22,11 @@ export class UserContextService {
// #enddocregion ctor, injectables
loadUser(userId:number){
let user = this._userService.getUserById(userId);
let user = this.userService.getUserById(userId);
this.name = user.name;
this.role = user.role;
this._loggerService.logDebug('loaded User');
this.loggerService.logDebug('loaded User');
}
// #docregion injectables, injectable
}

4
public/docs/_examples/cb-dependency-injection/ts/app/user.service.ts
View File

@ -1,5 +1,5 @@
// #docregion
import {Injectable} from '@angular/core';
import { Injectable } from '@angular/core';
@Injectable()
export class UserService {
@ -7,4 +7,4 @@ export class UserService {
getUserById(userId:number):any{
return {name:'Bombasto',role:'Admin'};
}
}
}

2
public/docs/_examples/cb-dependency-injection/ts/index.html
View File

@ -19,7 +19,7 @@
<script src="systemjs.config.js"></script>
<script>
System.import('app').catch(function(err){ console.error(err); });
System.import('app').catch(function(err){ console.error(err); });
</script>
</head>

7
public/docs/_examples/cb-dynamic-form/ts/app/app.component.ts
View File

@ -1,7 +1,8 @@
// #docregion
import {Component} from '@angular/core'
import {DynamicForm} from './dynamic-form.component';
import {QuestionService} from './question.service';
import { Component } from '@angular/core'
import { DynamicForm } from './dynamic-form.component';
import { QuestionService } from './question.service';
@Component({
selector: 'my-app',

7
public/docs/_examples/cb-dynamic-form/ts/app/dynamic-form-question.component.ts
View File

@ -1,7 +1,8 @@
// #docregion
import {Component, Input} from '@angular/core';
import {ControlGroup} from '@angular/common';
import {QuestionBase} from './question-base';
import { Component, Input } from '@angular/core';
import { ControlGroup } from '@angular/common';
import { QuestionBase } from './question-base';
@Component({
selector:'df-question',

14
public/docs/_examples/cb-dynamic-form/ts/app/dynamic-form.component.ts
View File

@ -1,10 +1,10 @@
// #docregion
import {Component, Input, OnInit} from '@angular/core';
import {ControlGroup} from '@angular/common';
import { Component, Input, OnInit } from '@angular/core';
import { ControlGroup } from '@angular/common';
import {QuestionBase} from './question-base';
import {QuestionControlService} from './question-control.service';
import {DynamicFormQuestionComponent} from './dynamic-form-question.component';
import { QuestionBase } from './question-base';
import { QuestionControlService } from './question-control.service';
import { DynamicFormQuestionComponent } from './dynamic-form-question.component';
@Component({
selector:'dynamic-form',
@ -18,10 +18,10 @@ export class DynamicForm {
form: ControlGroup;
payLoad = '';
constructor(private _qcs: QuestionControlService) { }
constructor(private qcs: QuestionControlService) { }
ngOnInit(){
this.form = this._qcs.toControlGroup(this.questions);
this.form = this.qcs.toControlGroup(this.questions);
}
onSubmit() {

5
public/docs/_examples/cb-dynamic-form/ts/app/main.ts
View File

@ -1,5 +1,6 @@
import {bootstrap} from '@angular/platform-browser-dynamic';
import {AppComponent} from './app.component';
import { bootstrap } from '@angular/platform-browser-dynamic';
import { AppComponent } from './app.component';
bootstrap(AppComponent, [])
.catch((err:any) => console.error(err));

12
public/docs/_examples/cb-dynamic-form/ts/app/question-control.service.ts
View File

@ -1,18 +1,18 @@
// #docregion
import {Injectable} from '@angular/core';
import {ControlGroup, FormBuilder, Validators} from '@angular/common';
import {QuestionBase} from './question-base';
import { Injectable } from '@angular/core';
import { ControlGroup, FormBuilder, Validators } from '@angular/common';
import { QuestionBase } from './question-base';
@Injectable()
export class QuestionControlService {
constructor(private _fb:FormBuilder){ }
constructor(private fb:FormBuilder){ }
toControlGroup(questions:QuestionBase<any>[] ) {
let group = {};
questions.forEach(question => {
group[question.key] = question.required ? [question.value || '', Validators.required] : [];
group[question.key] = question.required ? [question.value || '', Validators.required] : [question.value || ''];
});
return this._fb.group(group);
return this.fb.group(group);
}
}

2
public/docs/_examples/cb-dynamic-form/ts/app/question-dropdown.ts
View File

@ -1,5 +1,5 @@
// #docregion
import {QuestionBase} from './question-base';
import { QuestionBase } from './question-base';
export class DropdownQuestion extends QuestionBase<string>{
controlType = 'dropdown';

2
public/docs/_examples/cb-dynamic-form/ts/app/question-textbox.ts
View File

@ -1,5 +1,5 @@
// #docregion
import {QuestionBase} from './question-base';
import { QuestionBase } from './question-base';
export class TextboxQuestion extends QuestionBase<string>{
controlType = 'textbox';

11
public/docs/_examples/cb-dynamic-form/ts/app/question.service.ts
View File

@ -1,9 +1,10 @@
// #docregion
import {Injectable} from '@angular/core';
import {QuestionBase} from './question-base';
import {DynamicForm} from './dynamic-form.component';
import {TextboxQuestion} from './question-textbox';
import {DropdownQuestion} from './question-dropdown';
import { Injectable } from '@angular/core';
import { QuestionBase } from './question-base';
import { DynamicForm } from './dynamic-form.component';
import { TextboxQuestion } from './question-textbox';
import { DropdownQuestion } from './question-dropdown';
@Injectable()
export class QuestionService {

2
public/docs/_examples/cb-dynamic-form/ts/index.html
View File

@ -19,7 +19,7 @@
<script src="systemjs.config.js"></script>
<script>
System.import('app').catch(function(err){ console.error(err); });
System.import('app').catch(function(err){ console.error(err); });
</script>
</head>
<body>

4
public/docs/_examples/cb-set-document-title/ts/app/app.component.ts
View File

@ -20,10 +20,10 @@ template:
})
// #docregion class
export class AppComponent {
public constructor(private _titleService: Title ) { }
public constructor(private titleService: Title ) { }
public setTitle( newTitle: string) {
this._titleService.setTitle( newTitle );
this.titleService.setTitle( newTitle );
}
}
// #enddocregion class

1
public/docs/_examples/cb-set-document-title/ts/app/main.ts
View File

@ -1,5 +1,6 @@
// #docregion
import { bootstrap } from '@angular/platform-browser-dynamic';
import { AppComponent } from './app.component';
// While Angular supplies a Title service for setting the HTML document title

2
public/docs/_examples/cb-ts-to-js/ts/app/data.service.ts
View File

@ -1,4 +1,4 @@
import {Injectable} from '@angular/core';
import { Injectable } from '@angular/core';
@Injectable()
export class DataService {

2
public/docs/_examples/cb-ts-to-js/ts/app/hero-di-inject.component.ts
View File

@ -1,4 +1,4 @@
import {Component, Inject} from '@angular/core';
import { Component, Inject } from '@angular/core';
// #docregion
@Component({

5
public/docs/_examples/cb-ts-to-js/ts/app/hero-di.component.ts
View File

@ -1,5 +1,6 @@
import {Component} from '@angular/core';
import {DataService} from './data.service';
import { Component } from '@angular/core';
import { DataService } from './data.service';
// #docregion
@Component({

2
public/docs/_examples/cb-ts-to-js/ts/app/hero-io.component.ts
View File

@ -1,4 +1,4 @@
import {Component, EventEmitter, Input, Output} from '@angular/core';
import { Component, EventEmitter, Input, Output } from '@angular/core';
// #docregion
@Component({

2
public/docs/_examples/cb-ts-to-js/ts/app/hero-lifecycle.component.ts
View File

@ -1,6 +1,6 @@
// #docplaster
// #docregion
import {Component, OnInit}
import { Component, OnInit }
from '@angular/core';
// #enddocregion

2
public/docs/_examples/cb-ts-to-js/ts/app/hero.component.ts
View File

@ -1,6 +1,6 @@
// #docplaster
// #docregion metadata
import {Component} from '@angular/core';
import { Component } from '@angular/core';
@Component({
selector: 'hero-view',

4
public/docs/_examples/cb-ts-to-js/ts/app/heroes-bindings.component.ts
View File

@ -1,10 +1,10 @@
import {Component, HostBinding, HostListener} from '@angular/core';
import { Component, HostBinding, HostListener } from '@angular/core';
// #docregion
@Component({
selector: 'heroes-bindings',
template: `<h1 [class.active]="active">
Tour of Heroes
Tour ofHeroes
</h1>`
})
export class HeroesComponent {

22
public/docs/_examples/cb-ts-to-js/ts/app/main.ts
View File

@ -1,7 +1,7 @@
// #docregion ng2import
import {provide}
import { provide }
from '@angular/core';
import {bootstrap}
import { bootstrap }
from '@angular/platform-browser-dynamic';
import {
} from '@angular/router';
@ -12,18 +12,18 @@ import {
// #enddocregion ng2import
// #docregion appimport
import {HeroComponent}
import { HeroComponent }
from './hero.component';
// #enddocregion appimport
import {HeroComponent as HeroLifecycleComponent} from './hero-lifecycle.component';
import {HeroComponent as HeroDIComponent} from './hero-di.component';
import {HeroComponent as HeroDIInjectComponent} from './hero-di-inject.component';
import {AppComponent as AppDIInjectAdditionalComponent} from './hero-di-inject-additional.component';
import {AppComponent as AppIOComponent} from './hero-io.component';
import {HeroesComponent as HeroesHostBindingsComponent} from './heroes-bindings.component';
import {HeroesQueriesComponent} from './heroes-queries.component';
import { HeroComponent as HeroLifecycleComponent } from './hero-lifecycle.component';
import { HeroComponent as HeroDIComponent } from './hero-di.component';
import { HeroComponent as HeroDIInjectComponent } from './hero-di-inject.component';
import { AppComponent as AppDIInjectAdditionalComponent } from './hero-di-inject-additional.component';
import { AppComponent as AppIOComponent } from './hero-io.component';
import { HeroesComponent as HeroesHostBindingsComponent } from './heroes-bindings.component';
import { HeroesQueriesComponent } from './heroes-queries.component';
import {DataService} from './data.service';
import { DataService } from './data.service';
bootstrap(HeroComponent);
bootstrap(HeroLifecycleComponent);

2
public/docs/_examples/cb-ts-to-js/ts/index.html
View File

@ -15,7 +15,7 @@
<script src="systemjs.config.js"></script>
<script>
System.import('app').catch(function(err){ console.error(err); });
System.import('app').catch(function(err){ console.error(err); });
</script>
</head>

8
public/docs/_examples/component-styles/dart/lib/hero.dart Executable file
View File

@ -0,0 +1,8 @@
class Hero {
bool active = false;
final String name;
final List<String> team;
Hero(this.name, this.team);
}

21
public/docs/_examples/component-styles/dart/lib/hero_app_component.dart Executable file
View File

@ -0,0 +1,21 @@
import 'package:angular2/core.dart';
import 'hero.dart';
import 'hero_app_main_component.dart';
// #docregion
@Component(
selector: 'hero-app',
template: '''
<h1>Tour of Heroes</h1>
<hero-app-main [hero]="hero"></hero-app-main>''',
styles: const ['h1 { font-weight: normal; }'],
directives: const [HeroAppMainComponent])
class HeroAppComponent {
// #enddocregion
Hero hero =
new Hero('Human Torch', ['Mister Fantastic', 'Invisible Woman', 'Thing']);
@HostBinding('class')
String get themeClass => 'theme-light';
// #docregion
}

22
public/docs/_examples/component-styles/dart/lib/hero_app_main_component.dart Executable file
View File

@ -0,0 +1,22 @@
import 'package:angular2/core.dart';
import 'hero.dart';
import 'hero_details_component.dart';
import 'hero_controls_component.dart';
import 'quest_summary_component.dart';
@Component(
selector: 'hero-app-main',
template: '''
<quest-summary></quest-summary>
<hero-details [hero]="hero" [class.active]="hero.active">
<hero-controls [hero]="hero"></hero-controls>
</hero-details>''',
directives: const [
HeroDetailsComponent,
HeroControlsComponent,
QuestSummaryComponent
])
class HeroAppMainComponent {
@Input() Hero hero;
}

Some files were not shown because too many files have changed in this diff Show More