Question

我不明白是什么问题，我有一个 index.html 文件和一个 app.js 文件

Index.html 在锚标签中包含两个 ui-sref
app.js 作为状态提供者。请解决问题。感谢您抽出宝贵的时间

var app=angular.module('myApp',['ui.router']);
app.config(function($stateprovider){
    var home=
        {
            name:'home',
            url:'/home',
            template:"<h1>Home</h1>",
            controller: 'myCtrl'
        };
    var contacts=
        {
            name:'contacts',
            url:'/contacts',
            template:"<h1>Contacts</h1>",
            controller: 'myCtrl'
        };
        $stateprovider.state(home)
        $stateprovider.state(contacts)
});
app.controller("myCtrl",function($scope,$http){
})

<!doctype html>
<html ng-app="myApp">
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.2/angular.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular-route.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/1.0.20/angular-ui-router.js"></script>
    <script src="https://unpkg.com/angular-ui-router@0.4.2/release/angular-ui-router.js"></script>
    <script src="./app.js"></script>  
  </head>
  <body  >
      <div ng-controller="myCtrl">
        <ul>
          <li><a ui-sref="home">Home</a></li>
          <li><a ui-sref="contacts">Contacts</a></li>
        </ul>  
        <div>
          <div ui-view>
          </div>    
        </div>
      </div>
  </body>
</html>

Answer 1

如果你：

只保留一个角度路由器的脚本（1.0 版是最新的）
用$stateprovider替换$stateProvider

它工作正常：

var app=angular.module('myApp',['ui.router']);
app.config(function($stateProvider){
    var home=
        {
            name:'home',
            url:'/home',
            template:"<h1>Home</h1>",
            controller: 'myCtrl'
        };
    var contacts=
        {
            name:'contacts',
            url:'/contacts',
            template:"<h1>Contacts</h1>",
            controller: 'myCtrl'
        };
        $stateProvider.state(home)
        $stateProvider.state(contacts)
});
app.controller("myCtrl",function($scope,$http){
})

<!doctype html>
<html ng-app="myApp">
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.2/angular.min.js"></script>
   
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/1.0.20/angular-ui-router.js"></script>
   
    <script src="./app.js"></script>  
  </head>
  <body  >
      <div ng-controller="myCtrl">
        <ul>
          <li><a ui-sref="home">Home</a></li>
          <li><a ui-sref="contacts">Contacts</a></li>
        </ul>  
        <div>
          <div ui-view>
          </div>    
        </div>
      </div>
  </body>
</html>

AngularJS 路由问题 ui-router

1 个答案: