Ember Js: Getting Uncaught RangeError when calling Component

Question

I've created a simple route and component. I'm trying to call component from the template. But when i call, component is called recursively and getting the below error

vendor.js:58853 Uncaught RangeError: Maximum call stack size exceeded
    at Class.init (vendor.js:58853:20)
    at Class.superWrapper [as init] (vendor.js:33826:20)
    at Class.superFunction [as _super] (vendor.js:29300:20)
    at Class.init (vendor.js:56183:19)
    at Class.superWrapper (vendor.js:33826:20)
    at Class.superFunction [as _super] (vendor.js:29300:20)
    at Class.init (vendor.js:55450:19)
    at Class.superWrapper (vendor.js:33826:20)
    at Class.superFunction [as _super] (vendor.js:29300:20)
    at Class.init (vendor.js:54600:19)

Template.hbs contains the below

{{settings/admin-settings}}

modified the router.js as

this.route('admin-settings', { path: 'admin-configuration/admin-settings'}); ;

I didn't added anything to route.js and component.js