는 어떻게 예를 들어 여기에서 가져온

경로-UI를 다른 파일 JS에서 컨트롤러를 사용합니다 : http://scotch.io/tutorials/javascript/angular-routing-using-ui-router 나는 아래 경로-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 옵션으로 호출하십시오. 내 HTML 페이지 아래

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

});

된다 :

<!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>

내 완패-UI 여기

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

된다 : 여기

내가 다른 파일에 사용할 내 컨트롤러

출처

2014-10-20 Sa Xi

컨트롤러 만 사용해도 되셨습니까? 'Name_of_your_Controller'?

출처

2014-10-20 10:08:05

그래, 그 컨트롤러의 이름을 사용하려고했지만 오류 메시지가 나타납니다. 잘못된 인수 –

시도한 코드를 게시 할 수 있습니까? –

이 내 컨트롤러 : (함수() { '가 엄격한 사용'; 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 ('집', { URL : '/ 홈', templateUrl : 'home/partial-home.html', 컨트롤러 : 'myCtrl' }) }); –

는 어떻게 예를 들어 여기에서 가져온

답변

관련 문제