Angular JS和Ionic Controller无法正常工作

时间:2016-08-31 13:24:13

标签: angularjs ionic-framework

当我点击controller.jsng-click的按钮时,index.html中的我的控制器没有被调用。所有帮助表示赞赏。我正在使用Angular js 1和离子框架。

以下是我的文件:

    // controller.js
    angular.module('index')

    .controller('LoginCtrl', function($scope, $auth) {
        $scope.authenticate = function(provider) {
            $auth.authenticate(provider);
        };
    };


    //app.js
    angular.module('index', ['ionic', 'satellizer'])

    .run(function($ionicPlatform) {
        $ionicPlatform.ready(function() {
           if(window.cordova && window.cordova.plugins.Keyboard) {
            cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
            cordova.plugins.Keyboard.disableScroll(true);
           }
      if(window.StatusBar) {
        StatusBar.styleDefault();
      }
    });
    })

    .config(function($authProvider) {

    $authProvider.facebook({
      clientId: 'Facebook App ID'
    });

    $authProvider.facebook({
      clientId: 'Facebook App ID',
      responseType: 'token'
    });

    $authProvider.google({
      clientId: 'Google Client ID'
    });

    });




index.html file contents
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    <title></title>

    <link href="lib/ionic/css/ionic.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">
    <script src="lib/ionic/js/ionic.bundle.js"></script>
    <script src="cordova.js"></script>
    <script src="js/app.js"></script>
    <script src="js/controller.js"></script>
    </head>
    <body ng-app="index">

    <ion-pane>
      <ion-header-bar class="bar-stable">
        <h1 class="title">Hello</h1>
      </ion-header-bar>
      <ion-content ng-controller="LoginCtrl as login">
        <button ng-click="login.authenticate('facebook')">Sign in with Facebook</button>
        <button ng-click="login.authenticate('google')">Sign in with Google</button>
      </ion-content>
    </ion-pane>
    </body>
    </html>

1 个答案:

答案 0 :(得分:0)

获取变量app并为其指定角度模块。在控制器之后,您可以使用该app变量。

btnQuery1Start_Click()