Skip to content

Commit 961248c

Browse files
committed
Add Input component
1 parent 1f5b257 commit 961248c

File tree

4 files changed

+53
-0
lines changed

4 files changed

+53
-0
lines changed
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
<div>
2+
<p>You can use @Input to decorate a field making it accept values sent by the component props.</p>
3+
<p>For example:</p>
4+
<pre>
5+
export class TitleComponent {{ '{' }}
6+
@Input()
7+
message: string;
8+
{{ '}' }}
9+
</pre>
10+
11+
<p>And then you can call the component passing a value for message.</p>
12+
<pre>
13+
&lt;app-title message="Hello world" /&gt;
14+
</pre>
15+
16+
<app-title message="Hello world"></app-title>
17+
</div>

src/app/tutorials/input/input.component.scss

Whitespace-only changes.
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
2+
3+
import { InputComponent } from './input.component';
4+
import { SharedModule } from '../../shared/shared.module';
5+
6+
describe('InputComponent', () => {
7+
let component: InputComponent;
8+
let fixture: ComponentFixture<InputComponent>;
9+
10+
beforeEach(async(() => {
11+
TestBed.configureTestingModule({
12+
declarations: [ InputComponent ],
13+
imports: [SharedModule],
14+
})
15+
.compileComponents();
16+
}));
17+
18+
beforeEach(() => {
19+
fixture = TestBed.createComponent(InputComponent);
20+
component = fixture.componentInstance;
21+
fixture.detectChanges();
22+
});
23+
24+
it('should create', () => {
25+
expect(component).toBeTruthy();
26+
});
27+
});
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import { Component, Input } from '@angular/core';
2+
3+
@Component({
4+
selector: 'app-input',
5+
templateUrl: './input.component.html',
6+
styleUrls: ['./input.component.scss']
7+
})
8+
export class InputComponent {
9+
}

0 commit comments

Comments
 (0)