angular-cn/packages/examples/platform-browser/dom/debug/ts/by/by.ts

/**
 * @license
 * Copyright Google Inc. All Rights Reserved.
 *
 * Use of this source code is governed by an MIT-style license that can be
 * found in the LICENSE file at https://angular.io/license
 */

import {DebugElement} from '@angular/core';
import {By} from '@angular/platform-browser';

let debugElement: DebugElement = undefined !;
class MyDirective {}

// #docregion by_all
debugElement.query(By.all());
// #enddocregion

// #docregion by_css
debugElement.query(By.css('[attribute]'));
// #enddocregion

// #docregion by_directive
debugElement.query(By.directive(MyDirective));
// #enddocregion
chore(lint): Added license headers to most TypeScript files Relates to #9380 2016-06-23 09:47:54 -07:00			`/**`
			`* @license`
			`* Copyright Google Inc. All Rights Reserved.`
			`*`
			`* Use of this source code is governed by an MIT-style license that can be`
			`* found in the LICENSE file at https://angular.io/license`
			`*/`

repackaging: all the repackaging changes squashed 2016-04-28 17:50:03 -07:00			`import {DebugElement} from '@angular/core';`
style(lint): re-format modules/@angular 2016-06-08 16:38:52 -07:00			`import {By} from '@angular/platform-browser';`
docs(*): Document a lot more symbols that are missing comments in our generated docs. 2015-12-03 15:49:09 -08:00
fix: Update types for TypeScript nullability support in examples 2017-03-24 09:57:05 -07:00			`let debugElement: DebugElement = undefined !;`
docs(*): Document a lot more symbols that are missing comments in our generated docs. 2015-12-03 15:49:09 -08:00			`class MyDirective {}`

			`// #docregion by_all`
feat(debug): replace DebugElement with new Debug DOM Now, using `ng.probe(element)` in the browser console returns a DebugElement when in dev mode. `ComponentFixture#debugElement` also returns a new DebugElement. Breaking Change: This is a breaking change for unit tests. The API for the DebugElement has changed. Now, there is a DebugElement or DebugNode for every node in the DOM, not only nodes with an ElementRef. `componentViewChildren` is removed, and `childNodes` is a list of ElementNodes corresponding to every child in the DOM. `query` no longer takes a scope parameter, since the entire rendered DOM is included in the `childNodes`. Before: ``` componentFixture.debugElement.componentViewChildren[0]; ``` After ``` // Depending on the DOM structure of your component, the // index may have changed or the first component child // may be a sub-child. componentFixture.debugElement.children[0]; ``` Before: ``` debugElement.query(By.css('div'), Scope.all()); ``` After: ``` debugElement.query(By.css('div')); ``` Before: ``` componentFixture.debugElement.elementRef; ``` After: ``` componentFixture.elementRef; ``` 2016-01-13 21:35:21 -08:00			`debugElement.query(By.all());`
docs(*): Document a lot more symbols that are missing comments in our generated docs. 2015-12-03 15:49:09 -08:00			`// #enddocregion`

			`// #docregion by_css`
feat(debug): replace DebugElement with new Debug DOM Now, using `ng.probe(element)` in the browser console returns a DebugElement when in dev mode. `ComponentFixture#debugElement` also returns a new DebugElement. Breaking Change: This is a breaking change for unit tests. The API for the DebugElement has changed. Now, there is a DebugElement or DebugNode for every node in the DOM, not only nodes with an ElementRef. `componentViewChildren` is removed, and `childNodes` is a list of ElementNodes corresponding to every child in the DOM. `query` no longer takes a scope parameter, since the entire rendered DOM is included in the `childNodes`. Before: ``` componentFixture.debugElement.componentViewChildren[0]; ``` After ``` // Depending on the DOM structure of your component, the // index may have changed or the first component child // may be a sub-child. componentFixture.debugElement.children[0]; ``` Before: ``` debugElement.query(By.css('div'), Scope.all()); ``` After: ``` debugElement.query(By.css('div')); ``` Before: ``` componentFixture.debugElement.elementRef; ``` After: ``` componentFixture.elementRef; ``` 2016-01-13 21:35:21 -08:00			`debugElement.query(By.css('[attribute]'));`
docs(*): Document a lot more symbols that are missing comments in our generated docs. 2015-12-03 15:49:09 -08:00			`// #enddocregion`

			`// #docregion by_directive`
feat(debug): replace DebugElement with new Debug DOM Now, using `ng.probe(element)` in the browser console returns a DebugElement when in dev mode. `ComponentFixture#debugElement` also returns a new DebugElement. Breaking Change: This is a breaking change for unit tests. The API for the DebugElement has changed. Now, there is a DebugElement or DebugNode for every node in the DOM, not only nodes with an ElementRef. `componentViewChildren` is removed, and `childNodes` is a list of ElementNodes corresponding to every child in the DOM. `query` no longer takes a scope parameter, since the entire rendered DOM is included in the `childNodes`. Before: ``` componentFixture.debugElement.componentViewChildren[0]; ``` After ``` // Depending on the DOM structure of your component, the // index may have changed or the first component child // may be a sub-child. componentFixture.debugElement.children[0]; ``` Before: ``` debugElement.query(By.css('div'), Scope.all()); ``` After: ``` debugElement.query(By.css('div')); ``` Before: ``` componentFixture.debugElement.elementRef; ``` After: ``` componentFixture.elementRef; ``` 2016-01-13 21:35:21 -08:00			`debugElement.query(By.directive(MyDirective));`
docs(*): Document a lot more symbols that are missing comments in our generated docs. 2015-12-03 15:49:09 -08:00			`// #enddocregion`