2015-09-05 3 views
0

настроили $routeProvider для ответа Ajax на определенный шаблон URL, а также добавили DIV элемент с отображением контроллера:

<!-- class="hidden" to keep element hidden till AngularJs is not ready --> 
<div ng-controller="IModalCtrl" class="hidden" ng-show="is_visible" ng-view> 
    <!-- AJAX RESPONSE VIEWER --> 
</div> 

Об успешном запросе, содержание ответа добавления к целевой <div> элемент, но элемент не видно из-за ng-show, его значение модели не меняется.

Я не знаю, где можно изменить значение $scope.is_visible.

Ниже работа:

var app = angular.module('home', ['ngRoute']); 
app.config(['$routeProvider', '$locationProvider', '$httpProvider', 
    function ($routeProvider, $locationProvider, $httpProvider) { 
    $locationProvider.html5Mode(true); 
    $httpProvider.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest'; 
    $routeProvider.when('/news/:cat/:slug/:id', { 
     templateUrl: function (attr) { 
      console.log(attr); 
      return '/news/' + attr.cat + '/' + attr.slug + '/' + attr.id + '?ajax=1' 
     }, 
     controller: 'IModalCtrl' 
    }).otherwise('/'); 
}]); 

app.controller('IModalCtrl', function($scope, $http, $route, $routeParams, $location) { 
    // Keep element hidden default 
    $scope.is_visible = false; 
}); 

ответ

0

В принципе вы создали два экземпляра IModalCtrl контроллера, а один из них находится на ng-view DIV, а другой загружается из определения маршрута. Я не думаю, что требуется контроллер, который вы загружаете из определения маршрута.

Чтобы решить вашу проблему, вам не нужно использовать ng-show, вам нужно $scope.is_visible = true; после того, как ajax получит смену IModalCtrl.

Update

В таком случае вы могли бы взять использовать обещание, которое сообщит контроллер для загрузки, когда функция решительность будет завершена свое обещание.

$routeProvider.when('/news/:cat/:slug/:id', { 
    templateUrl: function (attr) { 
     console.log(attr); 
     return '/news/' + attr.cat + '/' + attr.slug + '/' + attr.id + '?ajax=1' 
    }, 
    controller: 'IModalCtrl', 
    resolve: { 
     getData: function($http){ 
      //this will get called before controller get loaded 
      //and the include this promise inside the controller. 
      return $http.get('url'); 
     } 
    } 

}) 
+0

Два экземпляра !!! Я следил за этими документами [https://docs.angularjs.org/api/ngRoute/service/$route](https://docs.angularjs.org/api/ngRoute/service/$route). Это мой вопрос, где я могу поместить этот код '$ scope.is_visible = true;'? – vinaykrsharma

+0

@vinaykrsharma, чего вы хотели достичь, используя флаг 'is_visible'? –

+0

Я хочу сделать элемент div видимым после добавления ответа Ajax! – vinaykrsharma