3

I am really lost with RC6 of angular2.

I don't manage to adapt my code with module and component and don't understand the differences between the two. Could you help me in integrating directives, providers, imports for a large scale applications.

The Google's documentation is not so clear yet.

Thanks in advance.

Cheers

Improve this question
2
  • 1
    If you are just starting a project, I suggest you leave RC6 and take a look at angular.io. They have good documentation for learning to develop Angular projects :) e.g here you can read about modules and components: angular.io/docs/ts/latest/guide/architecture.html Commented Dec 22, 2016 at 18:26
  • Maybe this SO question could help. Commented Dec 22, 2016 at 20:30

2 Answers 2

Reset to default
2

Basically, in Angular2, you have :

  • Modules : These are used to basically setup the logic of your application : How things are linked to each other. You start your application on bootstrapping a module.

    1. Imports : An array where you import the Angular2 Modules (Forms, etc.) and your next modules (DashboardModule, AdminModule, AuthentificationModule, etc.) as well as the Routing logic involved between your components.
    2. Declarations : An array where you declare the components that are linked to that module.
    3. Provider : An array where you declare your services or directives that are to be used with this module

  • Components : A "WebComponent" where you set the html to be injected into your navigator, with the associated CSS and it's behavior.

  • Services or Directives : Where you need to execute some app logic such as Authentication calls, states and so on.

  • A Router with outlets : That defines how you navigate in your application, based on the URL.

I tried to explain this with my own words so it's IS inaccurate on several levels, and that is why you have documentation sites such as angular.io. Hope this helps.

Official documentation on Modules => https://angular.io/docs/ts/latest/guide/ngmodule.html

Improve this answer
Sign up to request clarification or add additional context in comments.

4 Comments

Also, don't start on an older release, start right off the bat with the latest one, especially if you are new to the tech.
Thanks for your reply. I am not totally new that's why i am a bit lost with module. Here's a concrete example. To create a form, folloing the doc, this has to go in module: import { FormsModule, ReactiveFormsModule } from '@angular/forms'; This has to go in component: import { FormControl, FormGroup, Validators, FormBuilder } from '@angular/forms'; I don't understand why, how to know what is the right location for import. Also it seems that DI does not work properly with modules ? Possible ? Cheers
Be careful that angular forms have kinda changed, so do not hesitate to refer to the official documentation angular.io/docs/ts/latest/guide/forms.html. Most of the time, you will know what to import from the documentation, and to take your example, you know that you will manipulate forms and will have to tell import the FormsModule so that your linked components will be able to use Forms, and then import inside your components the Forms directives, such as FormControl or FormGroup.
What I always say myself is : "Oh I will need to use Forms in my components, so I need to import the corresponding Module in my own Module (FormsModule inside my module)". "And then to actually use them, I need to import the Directives linked to that module (such as FormGroup) in my component where I have my form."
1

Forget about all those boring tech spec, they just confused you more. I don't really believe there is such need to have two concepts, because in programming language they can be referred interchangeably, like we say vehicles and cars. Many articles on Angular2 don't refer to them distinguishably for general discussion until actual coding.

However here are the two key differences when looking at code:

  1. Component has class, template and metadata.
  2. Component is child of Module, meaning Module is always at a higher level of Component.

About No. 2, that said means Component is the leaf-level in the Angular2 structure. Here is a very good explanation.

Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.