是否可以在角度2的构造函数中声明变量

Question

This is the component I am referring to its a child component to the main component when the app is run, an error is thrown pointing to this components selector <app-new></app-new>

error says:

'No provider for String! ; Zone: ; Task: Promise.then ; Value: Error: No provider for String!'

import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-new',
  template: `<h2>SOme New Compnent which uses interpolation as well</h2>
  <h3>{{someProp}}</h3>`
})
export class CompyNewComponent implements OnInit {
  public prop2: string;
  public prop3: number;

  constructor(private someProp: string) {
    this.someProp = 'set throught the constuctor';
  }
  someMethod() {
    console.log(this.someProp);
  }

  ngOnInit() {
    this.someMethod();
    console.log('this is inside the ngoninit life cylce hook');
  }

}

// App Modules File

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppComponent } from './app.component';
import { NewComponent } from './new/new.component';
import { DirectDirective } from './direct.directive';
import { SomeComponent } from './compy/some.component';
import { CompyNewComponent } from './new compy/compy1.component';

@NgModule({
  declarations: [
    AppComponent,
    NewComponent,
    DirectDirective,
    SomeComponent,
  CompyNewComponent],
  imports: [
    BrowserModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

Answer 1

i think the error lies here -> constructor(private someProp: string) { this.someProp = 'set throught the constuctor'; } constructor(private someProp: string) { this.someProp = 'set throught the constuctor'; }

in angular inside a constructor you add services not properties like you do in react.

So remove the constructor and add this.prop1 = 'something1'; this.prop2 = 'something2'; this.prop1 = 'something1'; this.prop2 = 'something2';

inside the ngOnInit()

EDIT: import { CompyNewComponent } from './new compy/compy1.component'; there might be an error there too...better use - for example new-compy

Answer 2

If you define a class with a constructor, you can declare variables in that constructor:

class MyClass {
    constructor(public str: string, public value: number) {
    }
}

class AnotherClass {
    ...
    public myMethod(): void {
        let obj = new MyClass("Hello World", 10);
        ....
    }
}

However, when you define a component or a service, the constructor is called by Angular, which expects parameters with injection metadata, as mentioned in this Angular documentation about dependency injection:

When Angular creates a class whose constructor has parameters, it looks for type and injection metadata about those parameters so that it can inject the right service.

If Angular can't find that parameter information, it throws an error.

Angular can only find the parameter information if the class has a decorator of some kind. While any decorator will do, the @Injectable() decorator is the standard decorator for service classes.