Problem initializing router

[rhightower13]

I'm creating a simple application on HCP with the following Component.js file:

jQuery.sap.declare("ui5.Component");


sap.ui.core.UIComponent.extend("ui5.Component",{
  metadata: {
  },

  init: function() {

  jQuery.sap.require("sap.ui.core.routing.History");
        jQuery.sap.require("sap.m.routing.RouteMatchedHandler");

  //call createContent
  sap.ui.core.UIComponent.prototype.init.apply(this, arguments);

  this._router = this.getRouter();

  //initlialize the router
  this._routeHandler = new sap.m.routing.RouteMatchedHandler(this._router);
  this._router.initialize();

  },

  createContent: function() {

  var oView = sap.ui.view({
  id: "app",
  viewName: "ui5.view.App",
  type: "JS",
  viewData: {component: this}
  });

  var oModel = new sap.ui.model.json.JSONModel("model/data.json");
  oView.setModel(oModel);

  return oView;

  }

});

On line 19 I'm getting this error:

Uncaught TypeError: Cannot read property 'attachRouteMatched' of undefined

Turns out this.getRouter() is returning undefined.

Any suggestions?

Thanks,

Ross

[Former Member · Accepted solution]

You are getting the error because you have not defined the Routing configuration in your metadata of component.js.

Inside your metadata you have to provide the configuration.

something like this.

routing : {

  config : {

  viewType : "JS",

  viewPath : "",

  targetControl : "",

  clearTarget : false,

  },

  routes : [

  {

  pattern : "", // which appears in URL, while you navigate

  name : "",     // Name that is used in navTo method

  view : "",   // this is the target view that you are navigating to

  viewPath : "", // path of the target view

  targetAggregation : "" // this defines whether the target view is a

  },

  {

  pattern : "asdasd",

  name : "",

  view : "",

  viewPath : "",

  targetAggregation : ""

  },

  ]

  }

[rhightower13 · Accepted solution]

That was it.  I added the routes and it worked.

Thanks!