如何在其他文件中JS使用控制器路由UI

我從這個範例：http://scotch.io/tutorials/javascript/angular-routing-using-ui-router，我看到關於使用如下路線的UI的例子：如何在其他文件中JS使用控制器路由UI

$stateProvider 

    // HOME STATES AND NESTED VIEWS ======================================== 
    .state('home', { 
     url: '/home', 
     templateUrl: 'partial-home.html' 
    }) 

    // nested list with custom controller 
    .state('home.list', { 
     url: '/list', 
     templateUrl: 'partial-home-list.html', 
     controller: function($scope) { 
      $scope.dogs = ['Bernese', 'Husky', 'Goldendoodle']; 
     } 
    }) 

    // nested list with just some random string data 
    .state('home.paragraph', { 
     url: '/paragraph', 
     template: 'I could sure use a drink right now.' 
    })

我的問題是：我怎麼能在其他文件中使用控制器，然後將該控制器的名稱調用到.state的選項中？

這裏是我的控制，我想在其他文件中使用：

(function() { 
    'use strict'; 
    angular.module("myCtrl", []) 
    .controller('myCtrl', function ($scope) { 
     $scope.dogs = ['name 1', 'name 2', 'name 3', 'name 4']; 
    }) 
})();

，並在這裏被我擊潰的UI：

var routerApp = angular.module('routerApp', ['ui.router']); 

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

    $urlRouterProvider.otherwise('/home'); 

    $stateProvider 

     .state('home', { 
      url: '/home', 
      templateUrl: 'home/partial-home.html', 
      controller: 'myCtrl' 
     }) 

     .state('about', { 
      url: '/about', 
      templateUrl: 'about/partial-about.html' 
     }); 

});

以下是我的html頁面：

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8" /> 
    <title>testRoute</title> 

    <!-- testRoute references --> 
    <link href="css/index.css" rel="stylesheet" /> 
    <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css"> 
</head> 
<body ng-app="routerApp"> 
    <ul class="nav navbar-nav"> 
     <li><a ui-sref="home">Home</a></li> 
     <li><a ui-sref="about">About</a></li> 
    </ul> 
    <div ui-view></div> 
    <!-- Cordova reference, this is added to your app when it's built. --> 
    <script src="cordova.js"></script> 
    <script src="scripts/platformOverrides.js"></script> 

    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0/angular.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0/angular-resource.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0/angular-route.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.11/angular-ui-router.js"></script> 

    <script src="scripts/index.js"></script> 
    <script src="scripts/app.js"></script> 
    <!--<script src="scripts/myController.js"></script>--> 
</body> 
</html>

來源

2014-10-20 Sa Xi

你有沒有試過只做控制器：'Name_of_your_Controller'？

來源

2014-10-20 10:08:05

是的，我試圖使用該控制器的名稱，但我得到了一個錯誤消息：錯誤的參數 – 2014-10-20 14:32:26

你可以發佈代碼，你嘗試過嗎？ – 2014-10-20 14:34:17

這是我的控制器：（函數（）{ '使用嚴格'; angular.module（「myCtrl」，[]） .controller（ 'myCtrl'，函數（$範圍）{$ scope.dogs = ['名字1'，'名字2'，'名字3'，'名字4']; }） }）（）; 在這裏，我使用控制器的名稱： var routerApp = angular.module（'routerApp'，['ui.router']）; routerApp.config（函數（$ stateProvider，$ urlRouterProvider）{ $ urlRouterProvider.otherwise（ '/家庭'）; $ stateProvider .STATE（ '家'，{ 網址： '/家'， templateUrl ：'home/partial-home.html'， controller：'myCtrl' }） }）; – 2014-10-20 14:49:50

如何在其他文件中JS使用控制器路由UI

回答

相關問題