2016-03-03 5 views
1

Как позвонить ui-view с другого контроллера в AngularJS

Это моя примерная программа. Фактически здесь я использую вложенный ui-view. Проблема в том, что когда я нажимаю кнопку «Отправить», на самом деле она работает нормально и показывает предупреждение. SampleController

Но снова я нажал, что не получил SampleController, почему?

мне нужно идти к этому контроллеру, когда я нажимаю на кнопку отправить

ли какая-либо ошибка в моем code.Please проверить это мой stateProvider too.I я новый стартер в AngularJS

Plese поправьте меня Спасибо ...

var app=angular.module('TestApp', ['angular.filter','ui.router']); 
app.config(function($stateProvider, $urlRouterProvider) { 
    $urlRouterProvider.otherwise('/'); 
    $stateProvider 
     .state('category', { 
     views : { 
      "body" : { 
       url : '/category', 
       templateUrl : 'category.html', 
       controller : 'TestController' 
      } 
     }  
    }) 
    .state('category.subcategory', { 
     url : '/subcategory', 
     views : {        
      "[email protected]" : { 
       templateUrl : 'sample.html', 
       controller : 'SampleController'    
      } 
     } 
    }) 
}); 

app.controller('MainController', MainController); 
function MainController($scope,$state) { 
    alert("This is MainController") 
    $scope.getCategory=function(){ 
     $state.go('category'); 
    } 
} 

app.controller('TestController', TestController); 
function TestController($scope, $state){  
    $scope.getData=function() { 
     alert("Call to Sample Controller") 
     $state.go('.subcategory'); 
    } 
} 

app.controller('SampleController', SampleController); 
function SampleController($scope,$state) { 
    alert("This is SampleController") 
} 

Это мой образец HTML файлы index.html

<!DOCTYPE html> 
<html ng-app="TestApp"> 

    <head> 
    <link rel="stylesheet"> 
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js"></script> 
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular-route.min.js"></script> 
     <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-filter/0.5.8/angular-filter.js"></script> 
     <script src="angular-ui-router.js"></script>  
     <script src="script.js"></script> 
    </head> 
    <body ng-controller="MainController"> 
     <a href="#" ng-click="getCategory()">Click to Category</a> 
     <div ui-view="body"></div> 
    </body> 
</html> 

category.html

<div>  
    <input type="button" name="button" id="button" value="Submit" ng-click="getData()" /> 
    <div ui-view="subbody"></div> 
</div> 

sample.html

<div> 
    Sample Controller 
</div> 

Мне нужно попасть SampleController, когда я нажимаю кнопку отправить

+0

эта линия должна быть $ state.go ('category.subcategory'); вы должны передать все имя состояния –

+0

@adeel_s Да, я изменил, но он будет работать только изначально снова. Я изменю свою подкатегорию, которую она не будет работать. –

+0

Thats, потому что вы не даете ей никаких состояний. Имеет ли ваша категория идентификатор? то вы можете сделать что-то вроде .state ('category.subcategory', {url: '/ subcategory /: id'. –

ответ

3

Попробуйте это:

app.controller('TestController', TestController); 
    function TestController($scope, $state){  
    $scope.getData=function() { 
     alert("Call to Sample Controller") 
     $state.go('category.subcategory', null, {reload:true}); 
    } 
} 
+0

Он будет работать без перезагрузки также –

+0

@Nirmal Borkar Yeae будет работать только obe Niraml Ji, это проблема снова i измените мою подкатегорию, она не будет работать, не обновляя всю страницу –

+0

@ojus kulkarni Yeae будет работать только изначально, эта проблема снова изменит мою подкатегорию, она не будет работать без обновления всей страницы –

Смежные вопросы