00:00 WebStorm can easily add in missing imports if you type something like component. Hit Alt+Enter on it. Then hit Enter for add import statement. You can see it automatically adds it in. Similarly, if we come down here, I'll hit Ctrl+Space to invoke the autocompletion since it knows everything the component should have.
00:17 I'll type directives, hit Enter, and then that's an array. I want to bring in my contact list component. I usually type something like C-O-N-L so that when I hit Ctrl+Space, it can find that easily. You can see it found contact list container, and promise constructor like.
00:36 I'll hit Enter. Then Alt+Enter will allow me to add that import as well. Then as soon as you start adding more things, like I'll add an output, Alt+Enter to bring that in, you can see it automatically added it to that same line up here.
00:50 This can be my output. I'll type new event, email, something like that. Hit Ctrl+Space. I'll hit Enter to select that to autocomplete. Then when I come to import it, you can see I get a few different results. You might not be sure what these are.
01:06 One thing that can help is Ctrl+Shift+I can bring up a quick definition. As I go down through these, you can get a bit more detail on it to know which one you want. I know I want the event emitter from the async definition file, so I enter there.
01:22 Also, if you come up here and say are to import from Angular 2/core. I come in here, and I do Ctlr+Space. It'll show me all the exports from that. The one that I want is input. I'll go ahead and create my input.
01:43 If I invoke Ctrl+Alt+O, that's called optimize inputs. I'll undo that so you can see it before input is on this same line. WebStorm will know with Ctrl+Alt+O to move it up here to optimize it into a single statement.
02:00 Also, if I delete this line, that same optimize imports action, Ctrl+Alt+O, will remove input from there because it knows it's not being used in this file anymore. Lastly, for imports, you see I'm using single quotes here.
02:14 You can find that under File, Settings, then Editor, Code Style, Typescript, Other. Scroll down, and you can see single quote or double quote here. I chose single quote.