CODEWITHSUNDEEP
angularjsangularjs-directiveangular
mirazasx
mirazasx

Reputation: 166

Angular 2 bootsrap app component without template/template is served with html

I used to build applicaitons with angular1, there was possible to have directives on the allready loaded DOM elements, it was like you have the main component (app), wich is build from loaded html and then inside you can load directives from ether loaded html or load it from URL.

Howewer in angular2 it seems that to bootsrap application I have to use component which requires me to have template/templateURL, which I think is not nessesery since I don't want to load seperatly menues and other common stuff, I would rather do that on server level then laoding it seperatly. Does anyone knows how could I achive this in angular2?

Upvotes: 4

Views: 3367

Answers (2)

Gabi
Gabi

Reputation: 590

You can have directives but as @Günter Zöchbauer mentioned before you will need to bootstrap a component..

Change detector are created when a component is first instantiated. Here is an exaple for ng2 Directive from Angular documentation :

class Greeter {
   greet(name:string) {
     return 'Hello ' + name + '!';
   }
}
@Directive({
  selector: 'needs-greeter'
})
class NeedsGreeter {
  greeter:Greeter;
  constructor(greeter:Greeter) {
    this.greeter = greeter;
  }
}
@Component({
  selector: 'greet',
  viewProviders: [
    Greeter
  ],
  template: `<needs-greeter></needs-greeter>`,
  directives: [NeedsGreeter]
})
class HelloWorld {
}

See for more details: https://angular.io/docs/ts/latest/api/core/index/ComponentMetadata-class.html#!#constructor

But keep in mind that:

Each Angular component requires a single @Component annotation. The @Component annotation specifies when a component is instantiated, and which properties and hostListeners it binds to.

When a component is instantiated, Angular

  • creates a shadow DOM for the component.
  • loads the selected template into the shadow DOM.
  • creates all the injectable objects configured with providers and viewProviders.

Upvotes: 2

G&#252;nter Z&#246;chbauer
G&#252;nter Z&#246;chbauer

Reputation: 657308

In Angular2 you need to bootstrap a component and a component needs to have a view. Directives can't be bootstrapped. Directives can't be added or removed dynamically, they are only applied where static HTML in a components view matches their selector.

To me it sounds that for your use case Angular1 is the better fit.

Upvotes: 3

Related Questions