<ui-view></ui-view> unknown HTML TAG

[PriyankaBondarde]

package.json

"dependencies": {
    "@angular/animations": "^6.0.0",
    "@angular/common": "^6.0.0",
    "@angular/compiler": "^6.0.0",
    "@angular/core": "^6.0.0",
    "@angular/forms": "^6.0.0",
    "@angular/http": "^6.0.0",
    "@angular/platform-browser": "^6.0.0",
    "@angular/platform-browser-dynamic": "^6.0.0",
    "@angular/router": "^6.0.0",
    "@angular/upgrade": "^4.0.0",
    "@uirouter/angular-hybrid": "^3.0.1",
    "@uirouter/visualizer": "^4.0.0",
    "angular": "<2",
    "bootstrap": "^4.1.1",
    "core-js": "^2.5.4",
    "rxjs": "^6.1.0",
    "rxjs-compat": "^6.1.0",
    "zone.js": "^0.8.26"
  },

app.component.ts

          import {homeModule} from "./home.module";

          class homeCtrl  {
         blog = 'Blog'
          }

             const appComponent = {
              controller : homeCtrl,
               templateUrl: './home.component.html',
                 };
            homeModule.component('home', appComponent);

.html

 <ui-view> 
            <div class="col-md-12 col-sm-12 col-xs-12">
           <div class="h2 color-main-green margin-top-0">{{blog}}</div>
            <hr class="hr-homepage">
    </div>
</ui-view>

Html says that ui-view isunknown HTML tag. Because of this I'm getting error as Error: [$injector:unpr] Unknown provider: appDirectiveProvider <- appDirective and not able to route any solution?

[christopherthielen]

It sounds like you haven't configured @uirouter/angular-hybrid correctly. However, this issue doesn't have enough information to conclude anything at all. Please provide a way to reproduce the problem.

Here are two examples of angular-hybrid:

https://github.com/ui-router/sample-app-angular-hybrid https://stackblitz.com/edit/ui-router-angular-hybrid?file=app%2Fapp.module.ts

When you can provide a way to reproduce the problem, open an issue at the angular-hybrid repo