2014-02-11 3 views
2

Im новый для углового и Im, использующий версию 1.2.9. Я нашел пример маршрутизации и попытаюсь адаптировать его к моим потребностям.

Дело в том, что мне не нужно использовать какой-либо шаблон Я просто хочу, чтобы маршрут вызывал мой контроллер. Чтобы использовать угловое значение только маршрутизация некоторой части приложения.

Затем в контроллере я сделаю вызов Ajax для загрузки некоторых данных.

Я знаю, что это, вероятно, не лучшее решение, но проект начался без Углового, и мы его внедряем сейчас и не хотим перезапускать с нуля.

Проблема в том, что если я не вызываю никакого шаблона, контроллер не вызывается. Я знаю, что я могу вызвать контроллер в теге, например: <div ng-controller="...">, но это хорошее решение?

Спасибо

Так у меня app.js

var sampleApp = angular.module('sampleApp', ['ngRoute']); 
    sampleApp.config(['$routeProvider', 
     function($routeProvider) { 
     $routeProvider. 
      when('/AddNewOrder', { 
      templateUrl: 'templates/add_order.html', 
      controller: 'AddOrderController' //this controller is being called. 
     }). 
      when('/ShowOrders', { 
      controller: 'ShowOrdersController'//this controller is never called. 
      }). 
      otherwise({ 
      redirectTo: '/AddNewOrder' 
      }); 
    }]); 


    sampleApp.controller('AddOrderController', function($scope) { 
     console.log("AddOrderController") 
     $scope.message = 'This is Add new order screen'; 

    }); 

    sampleApp.controller('ShowOrdersController', function($scope) { 
     console.log("ShowOrdersController") 
     $scope.message = 'This is Show orders screen'; 

    }); 

HTML

<!DOCTYPE html> 
<html lang="en"> 
    <body ng-app="sampleApp"> 
     <ul class="nav"> 
      <li><a href="#AddNewOrder"> Add New Order </a></li> 
      <li><a href="#ShowOrders"> Show Order </a></li> 
     </ul> 
     <div class="col-md-9"> 
      <div ng-view></div> 
     </div> 
     <script src="./angular-lib/angular.js"></script> 
     <script src="./angular-lib/angular-route.js"></script> 
     <script src="./app.js"></script> 
    </body> 
</html> 

шаблон

<h2>Add New Order</h2> 

{{ message }} 

ответ

2

Вы можете использовать пустой шаблон для работы вокруг вопроса:

 when('/ShowOrders', { 
     template: '', 
     controller: 'ShowOrdersController' 
     }). 

я предпочел бы сделать это при настройке $routeProvider, а не использовать ng-controller = "...", потому что он держит декларацию контроллеров в одном месте, что делает код более ремонтопригоден , Если ng-controllers засорены в коде, то это затрудняет рассуждение о том, что будет scope.

Примечание:Prior to 1.2.7, в качестве шаблона для его работы следует использовать <br />. Для 1.2.9, an empty string should work.

+0

Он работает большое спасибо! – Merlin

1

Просто обратите внимание на использование template вместо templateUrl

when('/AddNewOrder', { 
    templateUrl: 'templates/add_order.html', //templateUrl 
    controller: 'AddOrderController' //this controller is being called. 
}). 

рабочего раствора с использованием EMPTY template

when('/ShowOrders', { 
    template: '', //template 
    controller: 'ShowOrdersController' 
}). 
Смежные вопросы