Question

已针对某些网址格式为Ajax响应配置了$routeProvider，还添加了带控制器映射的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>

成功请求后，响应内容将附加到目标＆lt; div＆gt;元素，但由于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;
});

Answer 1

基本上你已经创建了一个IModalCtrl控制器的两个实例，因为其中一个在ng-view div上，另一个从路由定义加载。我不认为你需要从路线定义中加载控制器。

要解决您的问题，您不需要使用ng-show，在ajax从$scope.is_visible = true;控制器获得成功后，您需要IModalCtrl。

<强>更新

在这种情况下，您可以使用promise，这将告诉控制器在解析函数完成其承诺时加载。

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

})

AngularJS：$ routeProvider配置，更改控制器范围值

1 个答案: