当 ui-sref 在 angular js ui 路由器中使用时,不会生成 href

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

我正在使用 angular js ui 路由器来路由我的页面,但由于某些原因 href 属性没有自动生成,因此我无法路由到我的页面,

请看下面我写的代码

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代码:

.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'
    })

此处提供的 plunker 演示中存在许多错误 https://plnkr.co/edit/CUTy44XPMopLyzBoZORl?p=preview

index.html

第 2 行:缺少 ng-app="app"

第 6 行:angular.js

后缺少引号

第 7 行:<scrip 而不是 <script

script.js

第 7 行:缺少依赖项注入。当然,有些 Gulp/Grunt 插件会为您完成,但最好知道它是如何工作的 ;) :

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

您必须使用此语法:

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

演示

这是你的 plunker 的固定版本:
https://plnkr.co/edit/0Hrm5zz4yb17cJEH0XQY?p=preview