refactor(core): renamed injectables into appInjector

BREAKING CHANGES

Before:

@Component({injectables: [Type]} class MyCmp{}

After:

@Component({appInjector: [Type]} class MyCmp{}
This commit is contained in:
vsavkin 2015-05-16 15:21:36 -07:00
parent 3a53f67911
commit 7b511462af
17 changed files with 34 additions and 52 deletions

View File

@ -216,7 +216,7 @@ To better understand the kinds of injections which are supported in Angular we h
### Injecting Services ### Injecting Services
Service injection is the most straight forward kind of injection which Angular supports. It involves a component configuring the `injectables` and then letting the directive ask for the configured service. Service injection is the most straight forward kind of injection which Angular supports. It involves a component configuring the `appInjector` and then letting the directive ask for the configured service.
This example illustrates how to inject `MyService` into `House` directive. This example illustrates how to inject `MyService` into `House` directive.
@ -227,7 +227,7 @@ class MyService {} | Assume a service which needs to be inject
| |
@Component({ | Assume a top level application component which @Component({ | Assume a top level application component which
selector: 'my-app', | configures the services to be injected. selector: 'my-app', | configures the services to be injected.
injectables: [MyService] | appInjector: [MyService] |
}) | }) |
@View({ | Assume we have a template that needs to be @View({ | Assume we have a template that needs to be
templateUrl: 'my_app.html', | configured with directives to be injected. templateUrl: 'my_app.html', | configured with directives to be injected.
@ -330,7 +330,7 @@ Shadow DOM provides an encapsulation for components, so as a general rule it doe
``` ```
@Component({ @Component({
selector: '[kid]', selector: '[kid]',
injectables: [] appInjector: []
}) })
@View({ @View({
templateUrl: 'kid.html', templateUrl: 'kid.html',
@ -349,7 +349,7 @@ class Kid {
@Component({ @Component({
selector: '[dad]', selector: '[dad]',
injectables: [Grandpa] appInjector: [Grandpa]
}) })
@View({ @View({
templateUrl: 'dad.html', templateUrl: 'dad.html',
@ -364,7 +364,7 @@ class Dad {
@Component({ @Component({
selector: '[grandpa]', selector: '[grandpa]',
injectables: [] appInjector: []
}) })
@View({ @View({
templateUrl: 'grandpa.html', templateUrl: 'grandpa.html',

View File

@ -714,7 +714,7 @@ export class Directive extends Injectable {
* When a component is instantiated, Angular * When a component is instantiated, Angular
* - creates a shadow DOM for the component. * - creates a shadow DOM for the component.
* - loads the selected template into the shadow DOM. * - loads the selected template into the shadow DOM.
* - creates a child {@link Injector} which is configured with the `injectables` for the {@link Component}. * - creates a child {@link Injector} which is configured with the `appInjector` for the {@link Component}.
* *
* All template expressions and statements are then evaluated against the component instance. * All template expressions and statements are then evaluated against the component instance.
* *
@ -800,16 +800,16 @@ export class Component extends Directive {
/** /**
* Defines the set of injectable objects that are visible to a Component and its children. * Defines the set of injectable objects that are visible to a Component and its children.
* *
* The `injectables` defined in the Component annotation allow you to configure a set of bindings for the component's * The `appInjector` defined in the Component annotation allow you to configure a set of bindings for the component's
* injector. * injector.
* *
* When a component is instantiated, Angular creates a new child Injector, which is configured with the bindings in * When a component is instantiated, Angular creates a new child Injector, which is configured with the bindings in
* the Component `injectables` annotation. The injectable objects then become available for injection to the component * the Component `appInjector` annotation. The injectable objects then become available for injection to the component
* itself and any of the directives in the component's template, i.e. they are not available to the directives which * itself and any of the directives in the component's template, i.e. they are not available to the directives which
* are children in the component's light DOM. * are children in the component's light DOM.
* *
* *
* The syntax for configuring the `injectables` injectable is identical to {@link Injector} injectable configuration. * The syntax for configuring the `appInjector` injectable is identical to {@link Injector} injectable configuration.
* See {@link Injector} for additional detail. * See {@link Injector} for additional detail.
* *
* *
@ -826,7 +826,7 @@ export class Component extends Directive {
* *
* @Component({ * @Component({
* selector: 'greet', * selector: 'greet',
* injectables: [ * appInjector: [
* Greeter * Greeter
* ] * ]
* }) * })
@ -843,7 +843,7 @@ export class Component extends Directive {
* } * }
* ``` * ```
*/ */
injectables:List; appInjector:List;
@CONST() @CONST()
constructor({ constructor({
@ -854,7 +854,7 @@ export class Component extends Directive {
hostProperties, hostProperties,
hostAttributes, hostAttributes,
hostActions, hostActions,
injectables, appInjector,
lifecycle, lifecycle,
changeDetection = DEFAULT, changeDetection = DEFAULT,
compileChildren = true compileChildren = true
@ -866,7 +866,7 @@ export class Component extends Directive {
hostProperties:any, hostProperties:any,
hostAttributes:any, hostAttributes:any,
hostActions:any, hostActions:any,
injectables:List, appInjector:List,
lifecycle:List, lifecycle:List,
changeDetection:string, changeDetection:string,
compileChildren:boolean compileChildren:boolean
@ -885,7 +885,7 @@ export class Component extends Directive {
}); });
this.changeDetection = changeDetection; this.changeDetection = changeDetection;
this.injectables = injectables; this.appInjector = appInjector;
} }
} }

View File

@ -184,7 +184,7 @@ function _createNgZone(givenReporter:Function): NgZone {
* 1. It uses the component's `selector` property to locate the DOM element which needs to be upgraded into * 1. It uses the component's `selector` property to locate the DOM element which needs to be upgraded into
* the angular component. * the angular component.
* 2. It creates a new child injector (from the platform injector) and configures the injector with the component's * 2. It creates a new child injector (from the platform injector) and configures the injector with the component's
* `injectables`. Optionally, you can also override the injector configuration for an app by invoking * `appInjector`. Optionally, you can also override the injector configuration for an app by invoking
* `bootstrap` with the `componentInjectableBindings` argument. * `bootstrap` with the `componentInjectableBindings` argument.
* 3. It creates a new `Zone` and connects it to the angular application's change detection domain instance. * 3. It creates a new `Zone` and connects it to the angular application's change detection domain instance.
* 4. It creates a shadow DOM on the selected component's host element and loads the template into it. * 4. It creates a shadow DOM on the selected component's host element and loads the template into it.
@ -227,7 +227,7 @@ function _createNgZone(givenReporter:Function): NgZone {
* # API * # API
* - `appComponentType`: The root component which should act as the application. This is a reference to a `Type` * - `appComponentType`: The root component which should act as the application. This is a reference to a `Type`
* which is annotated with `@Component(...)`. * which is annotated with `@Component(...)`.
* - `componentInjectableBindings`: An additional set of bindings that can be added to `injectables` for the * - `componentInjectableBindings`: An additional set of bindings that can be added to `appInjector` for the
* {@link Component} to override default injection behavior. * {@link Component} to override default injection behavior.
* - `errorReporter`: `function(exception:any, stackTrace:string)` a default error reporter for unhandled exceptions. * - `errorReporter`: `function(exception:any, stackTrace:string)` a default error reporter for unhandled exceptions.
* *

View File

@ -279,8 +279,8 @@ export class DirectiveBinding extends ResolvedBinding {
var changeDetection = null; var changeDetection = null;
if (ann instanceof Component) { if (ann instanceof Component) {
renderType = DirectiveMetadata.COMPONENT_TYPE; renderType = DirectiveMetadata.COMPONENT_TYPE;
if (isPresent(ann.injectables)) { if (isPresent(ann.appInjector)) {
resolvedInjectables = Injector.resolve(ann.injectables); resolvedInjectables = Injector.resolve(ann.appInjector);
} }
changeDetection = ann.changeDetection; changeDetection = ann.changeDetection;
} else { } else {

View File

@ -14,7 +14,7 @@ import {DOM} from 'angular2/src/dom/dom_adapter';
* ```javascript * ```javascript
* @Component({ * @Component({
* selector: 'my-app', * selector: 'my-app',
* injectables: [ * appInjector: [
* bind(ExceptionHandler).toClass(MyExceptionHandler) * bind(ExceptionHandler).toClass(MyExceptionHandler)
* ] * ]
* }) * })

View File

@ -14,7 +14,7 @@ import * as modelModule from './model';
* *
* @Component({ * @Component({
* selector: 'login-comp', * selector: 'login-comp',
* injectables: [ * appInjector: [
* FormBuilder * FormBuilder
* ] * ]
* }) * })

View File

@ -279,7 +279,7 @@ class DynamicComp {
@Component({ @Component({
selector: 'hello-cmp', selector: 'hello-cmp',
injectables: [DynamicallyCreatedComponentService] appInjector: [DynamicallyCreatedComponentService]
}) })
@View({ @View({
template: "{{greeting}}" template: "{{greeting}}"

View File

@ -516,7 +516,7 @@ export function main() {
it("should instantiate component directives that depend on app services in the shadow app injector", () => { it("should instantiate component directives that depend on app services in the shadow app injector", () => {
var directiveAnnotation = new Component({ var directiveAnnotation = new Component({
injectables: [ appInjector: [
bind("service").toValue("service") bind("service").toValue("service")
] ]
}); });
@ -531,7 +531,7 @@ export function main() {
it("should not instantiate other directives that depend on app services in the shadow app injector", () => { it("should not instantiate other directives that depend on app services in the shadow app injector", () => {
var directiveAnnotation = new Component({ var directiveAnnotation = new Component({
injectables: [ appInjector: [
bind("service").toValue("service") bind("service").toValue("service")
] ]
}); });

View File

@ -21,7 +21,7 @@ void functionThatThrows() {
main() { main() {
describe('TypeLiteral', () { describe('TypeLiteral', () {
it('should publish via injectables', it('should publish via appInjector',
inject([TestBed, AsyncTestCompleter], (tb, async) { inject([TestBed, AsyncTestCompleter], (tb, async) {
tb.overrideView(Dummy, new View( tb.overrideView(Dummy, new View(
template: '<type-literal-component></type-literal-component>', template: '<type-literal-component></type-literal-component>',
@ -57,7 +57,7 @@ class Dummy {}
@Component( @Component(
selector: 'type-literal-component', selector: 'type-literal-component',
injectables: const [ appInjector: const [
const Binding( const Binding(
const TypeLiteral<List<String>>(), const TypeLiteral<List<String>>(),
toValue: const <String>['Hello', 'World']) toValue: const <String>['Hello', 'World'])

View File

@ -27,7 +27,6 @@ import {PipeRegistry, defaultPipeRegistry,
ChangeDetection, DynamicChangeDetection, Pipe, ChangeDetectorRef, ON_PUSH} from 'angular2/change_detection'; ChangeDetection, DynamicChangeDetection, Pipe, ChangeDetectorRef, ON_PUSH} from 'angular2/change_detection';
import {Directive, Component} from 'angular2/src/core/annotations_impl/annotations'; import {Directive, Component} from 'angular2/src/core/annotations_impl/annotations';
import {DynamicComponentLoader} from 'angular2/src/core/compiler/dynamic_component_loader';
import {QueryList} from 'angular2/src/core/compiler/query_list'; import {QueryList} from 'angular2/src/core/compiler/query_list';
import {View} from 'angular2/src/core/annotations_impl/view'; import {View} from 'angular2/src/core/annotations_impl/view';
import {Parent, Ancestor} from 'angular2/src/core/annotations_impl/visibility'; import {Parent, Ancestor} from 'angular2/src/core/annotations_impl/visibility';
@ -1112,7 +1111,7 @@ class ComponentWithPipes {
@Component({ @Component({
selector: 'child-cmp', selector: 'child-cmp',
injectables: [MyService], appInjector: [MyService],
}) })
@View({ @View({
directives: [MyDir], directives: [MyDir],
@ -1177,7 +1176,7 @@ class CompWithAncestor {
@Component({ @Component({
selector: '[child-cmp2]', selector: '[child-cmp2]',
injectables: [MyService] appInjector: [MyService]
}) })
class ChildComp2 { class ChildComp2 {
ctxProp:string; ctxProp:string;
@ -1414,23 +1413,6 @@ class NeedsPublicApi {
} }
} }
@Component({
selector: 'child',
injectables: [AppDependency]
})
@View({
template: `<div>{{parent.message}}</div>,<div>{{appDependency.parent.message}}</div>`
})
class ChildComponent {
parent:ParentInterface;
appDependency:AppDependency;
constructor(p:ParentInterface, a:AppDependency) {
this.parent = p;
this.appDependency = a;
}
}
@Directive({ @Directive({
selector: '[toolbar-vc]', selector: '[toolbar-vc]',
properties: { properties: {

View File

@ -14,7 +14,7 @@ void initReflector(reflector) {
'parameters': const [], 'parameters': const [],
'annotations': const [ 'annotations': const [
const Component( const Component(
selector: '[soup]', injectables: const [dep.DependencyComponent]) selector: '[soup]', appInjector: const [dep.DependencyComponent])
] ]
}); });
} }

View File

@ -15,7 +15,7 @@ void initReflector(reflector) {
'parameters': const [], 'parameters': const [],
'annotations': const [ 'annotations': const [
const Component( const Component(
selector: '[soup]', injectables: const [dep.DependencyComponent]) selector: '[soup]', appInjector: const [dep.DependencyComponent])
] ]
}); });
i0.initReflector(reflector); i0.initReflector(reflector);

View File

@ -124,7 +124,7 @@ class SurveyQuestion {
// SurveyBuilder is a form that allows you to create a survey. // SurveyBuilder is a form that allows you to create a survey.
@Component({ @Component({
selector: 'survey-builder-app', selector: 'survey-builder-app',
injectables: [FormBuilder] appInjector: [FormBuilder]
}) })
@View({ @View({
template: ` template: `

View File

@ -21,7 +21,7 @@ import {View} from 'angular2/src/core/annotations_impl/view';
selector: 'hello-app', selector: 'hello-app',
// These are services that would be created if a class in the component's // These are services that would be created if a class in the component's
// template tries to inject them. // template tries to inject them.
injectables: [GreetingService] appInjector: [GreetingService]
}) })
// The template for the component. // The template for the component.
@View({ @View({

View File

@ -13,7 +13,7 @@ import {View} from 'angular2/src/core/annotations_impl/view';
@Component({ @Component({
selector: 'demo-app', selector: 'demo-app',
injectables: [MdDialog] appInjector: [MdDialog]
}) })
@View({ @View({
templateUrl: './demo_app.html', templateUrl: './demo_app.html',

View File

@ -12,7 +12,7 @@ import {View} from 'angular2/src/core/annotations_impl/view';
@Component({ @Component({
selector: 'demo-app', selector: 'demo-app',
injectables: [MdRadioDispatcher] appInjector: [MdRadioDispatcher]
}) })
@View({ @View({
templateUrl: './demo_app.html', templateUrl: './demo_app.html',

View File

@ -10,7 +10,7 @@ import {View} from 'angular2/src/core/annotations_impl/view';
@Component({ @Component({
selector: 'todo-app', selector: 'todo-app',
injectables: [ appInjector: [
Store, Store,
TodoFactory TodoFactory
] ]