如何在其他文件中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

回答

相关问题