Harish
Harish

Reputation: 1273

href is not getting generated when ui-sref is used in angular js ui router

I'm using angular js ui router to route my pages, but for some reason href attribute is not getting generated automatically, because of this I couldn't route to my pages,

Please take a look at the code that I have written below

mainpage.html
    <a ui-sref="main-page" class="col-md-4 col-sm-6 col-xs-12 cards">

subpage.html
<div class="row">
      <ul class="nav nav-pills col-md-12">
      <li class="nav-item">
          <a role="tab" class="nav-link active" data-toggle="pill" ui-sref="main-page.new">
          </a>
      </li>

Js Code:

.state('main-page',{
        url: '/main-page',
        templateUrl: 'mainpage.html',
        controller: 'mainpageController'
     })

.state('main-page.new',{
        url: '/main-page-new',
        templateUrl: 'main-page-new.html',
        controller: 'mainPageNewController'
    })

Upvotes: 0

Views: 132

Answers (1)

Stephane Janicaud
Stephane Janicaud

Reputation: 3627

There are many errors in your plunker demo available here https://plnkr.co/edit/CUTy44XPMopLyzBoZORl?p=preview

index.html

line 2 : missing ng-app="app"

line 6 : missing quote after angular.js

line 7 : <scrip instead of <script

script.js

line 7 : missing dependencies injection. Of course some Gulp/Grunt plugins do it for you but it's good to know how it works ;) :

app.config(function($stateProvider, $urlRouterProvider){

You must use this syntax :

app.config(['$stateProvider', '$urlRouterProvider', function($stateProvider, $urlRouterProvider) {

Demo

Here is the fixed version of your plunker :
https://plnkr.co/edit/0Hrm5zz4yb17cJEH0XQY?p=preview

Upvotes: 1

Related Questions