Reputation: 1
I use Angular ^4.2.4.
Need global function range for all components:
import { Injectable } from '@angular/core';
@Injectable()
export class Global {
range:object = function(n:number){
var vs = [];
for( var i=0; i < n; i++ )
vs.push(i);
return vs;
}
}
Component example of root:
import { Component } from '@angular/core';
import { Global } from "./global";
@Component({
selector: 'app-root'
,templateUrl: '<ul><li *ngFor="let i of global.range(5)">{{i}}</li></ul>'
,providers: [ Global ]
})
export class AppComponent {
constructor( public global: Global ){}
}
But console log is:
ERROR TypeError: Cannot read property 'range' of undefined
at Object.eval [as updateDirectives] (AppHome.ngfactory.js:19)
at Object.debugUpdateDirectives [as updateDirectives] (core.es5.js:13065)
at checkAndUpdateView (core.es5.js:12245)
at callViewAction (core.es5.js:12610)
at execComponentViewsAction (core.es5.js:12542)
at checkAndUpdateView (core.es5.js:12251)
at callViewAction (core.es5.js:12610)
at execEmbeddedViewsAction (core.es5.js:12568)
at checkAndUpdateView (core.es5.js:12246)
at callViewAction (core.es5.js:12610)
That instruction don't work for me...
Upvotes: 0
Views: 1918
Reputation: 68665
1) Make your method public
@Injectable()
export class Global {
public range(n:number): number[] {
const vs: number[] = [];
for( let i = 0; i < n; i++ ) {
vs.push(i);
}
return vs;
}
}
2) Change templateUrl
to template
@Component({
selector: 'app-root',
template: '<ul><li *ngFor="let i of global.range(5)">{{ i }}</li></ul>',
providers: [Global]
})
export class AppComponent {
constructor( public global: Global ) { }
}
Upvotes: 1
Reputation: 1391
You should use modifiers like:
public;
private;
protected;
when You declaring variables like: public range
;
Upvotes: 0