3

有没有办法在没有手动启动角度的情况下初始化角度和端点？

我以为我在这里找到了一个优雅的解决方案。

不幸的是，window.init 并不总是在回调调用它之前声明，尽管脚本的顺序是。它在刷新时工作正常，但并不总是在第一页加载时。控制台输出“Uncaught TypeError: Object [object global] has no method 'init'”。

最后，我尝试从端点回调手动引导角度（例如，这里，但在尝试这个时，它会导致延迟，角度应该替换车把占位符，所以 html 几秒钟内充满了车把。我很欣赏这可能是唯一的方法是这样做，但是上面来自谷歌的第一个链接建议不这样做。

更新：

function customerInit(){
    angular.element(document).ready(function() {
    window.init();
     });
}

这似乎解决了我的问题，它强制在端点之前初始化角度控制器。这在谷歌页面上没有提到，但似乎有必要强制执行初始化顺序。

hmtl:

<html ng-app lang="en">
    <head>
        <link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0-rc1/css/bootstrap.min.css">

        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
        <script src="js/customer.js"></script>
        <script src="https://apis.google.com/js/client.js?onload=customerInit"></script>

    </head>

<body>

<div  class="container" ng-controller="customerCtrl">
        <div class="page-header">
            <h1>Customers</h1>
        </div>

        <div class="row">
        <div class="col-lg-10">

                <table id="customerTable" class="table table-striped table-bordered table-hover">
                    <thead>
                        <tr>
                            <th>First Name</th>
                            <th>Surname</th>
                            <th>Email Address</th>
                            <th>Home Phone</th>
                            <th>Mobile Phone</th>
                            <th>Work Phone</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr ng-repeat="customer in allCustomers">
                            <td>{{customer.firstName}}</td>
                            <td>{{customer.surName}}</td>
                            <td>{{customer.emailAddress}}</td>
                            <td>{{customer.homePhone}}</td>
                            <td>{{customer.mobilePhone}}</td>
                            <td>{{customer.workPhone}}</td>
                        </tr>
                    </tbody>
                </table>    

            </div>
        </div>
        </div>

</div>

        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
        <script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0-rc1/js/bootstrap.min.js"></script>

    </body>
</html>

客户.js：

function customerInit(){
    window.init();
}

function customerCtrl ($scope) {

    window.init= function() {
          $scope.$apply($scope.load_customer_lib);
        };

    $scope.is_backend_ready = false;

    $scope.allCustomers = [];

    $scope.load_customer_lib = function() {
                                gapi.client.load('customer', 'v1', function() {
                                    $scope.is_backend_ready = true;
                                    $scope.getAllCustomers();
                                  }, '/_ah/api');
                                };


    $scope.getAllCustomers = function(){

        gapi.client.customer.customer.getCentreCustomers()
                                .execute(function(resp) {

                                     $scope.$apply(function () {
                                        $scope.allCustomers = resp.items;
                                     });

                                });
    };


};
4

2 回答 2

3

这整理了我的启动顺序：

function customerInit(){
        angular.element(document).ready(function() {
        window.init();
         });
    }

ng-cloak 指令阻止我看到一闪而过的未解析的角度指令。

于 2013-08-27T13:23:17.473 回答
2

一种方法是将多个调用包装成 Promise 在这里完成详细信息 http://anandsekar.github.io/initialize-google-appengine-and-angularjs/

angular.module('webApp').factory('cloudendpoint', function ($q) {
    return {
        init:function() {
            var ROOT = '//' + window.location.host + '/_ah/api';
            var hwdefer=$q.defer();
            var oauthloaddefer=$q.defer();
            var oauthdefer=$q.defer();

            gapi.client.load('helloworld', 'v1', function() {
                hwdefer.resolve(gapi);
            }, ROOT);
            gapi.client.load('oauth2', 'v2', function(){
                oauthloaddefer.resolve(gapi);
            });
            var chain=$q.all([hwdefer.promise,oauthloaddefer.promise]);
            return chain;
        },
});
于 2014-10-07T05:17:18.123 回答