Question

我正在尝试从服务器获取数据。由于它的提取我想显示一个模态，直到它没有完全加载。

这是我正在使用的。

<ons-page ng-controller="directoryControl">

      <ons-modal var="modal">
        <ons-icon icon="ion-load-c" spin="true"></ons-icon>
        <br><br>
        Please wait.<br>Closing in 2 seconds.
      </ons-modal>

      <ons-list>

        <ons-list-item modifier="chevron" class="list-item-container" ng-repeat="PostCategory in PostCategories">
          <ons-row>
            <ons-col>
              <div class="name">
                {{PostCategory.title}}
              </div>
            </ons-col>
          </ons-row>
        </ons-list-item>
      </ons-list>
    </ons-page>

我的模态在angularjs中看起来如何。

var module = angular.module('app', ['onsen']);
    module.controller('directoryControl', function($scope, $http) {
    ons.ready(function() {

                    //console.log($scope.username + ", " + $scope.password);
                    modal.show();

                    var responsePromise = $http.get("http://www.mywebsitepadth.com/api/get_category_index/");
                    responsePromise.success(function(data, status, headers, config) {
                        modal.hide();
                    });
                    responsePromise.error(function(data, status, headers, config) {
                        alert("ajax didnt work");
                    });
        });
    });

我可以知道为什么在我这样做的时候没有显示模态modal.show();？

谢谢！

Answer 1

让你的模特像这样的直接孩子。

<body>
   <ons-modal var="modal">
        <ons-icon icon="ion-load-c" spin="true"></ons-icon>
        <br><br>
        Please wait.<br>Closing in 2 seconds.
      </ons-modal>

通过这种方式，您可以在任何控制器的任何位置访问模式。现在你的控制器应该是这样的。

module.controller('directoryControl', function($scope, $http) {

                    //console.log($scope.username + ", " + $scope.password);
                    modal.show();

                    var responsePromise = $http.get("http://www.mywebsitepadth.com/api/get_category_index/");
                    responsePromise.success(function(data, status, headers, config) {
                        modal.hide();
                    });
                    responsePromise.error(function(data, status, headers, config) {
                        alert("ajax didnt work");
                    });
    });

在angularjs

1 个答案: