当在Angular JS UI路由器中使用UI-SREF时，HREF不会生成

Question

我正在使用Angular JS UI路由器来路由我的页面，但是由于某种原因，HREF属性不会自动生成，因为我无法将其路由到我的页面，p>请查看我在下面写的代码

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

Answer 1

您的plunker演示中有很多错误https://plnkr.co/edit/cuty44xpmoplyzbozorl?p=preview

index.html

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

第6行：angular.js

后缺少报价

第7行：<scrip代替<script

脚本.js

第7行：缺失依赖项注入。当然，某些Gulp/Grunt插件会为您服务，但是很高兴知道它是如何工作的；）：

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

您必须使用此语法：

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

demo

这是您的plunker的固定版本：
https://plnkr.co/edit/0hrm5zz4yb17cjeh0xqy？p = preview