從javascript函數調用指令中定義的控制器中的方法

Question

我正在尋找一種方法來調用全局函數中指令中定義的控制器中的方法。我能夠成功地在模塊中定義控制器，並在正常的html元素中使用ng-controller聲明控制器。然後我得到了控制，並從javascript函數這樣的範圍：

function signinCallback(authResult) { 
    var googleLoginControllerElement = document.getElementById('googlelogin'); 
    var ctrlScope = angular.element(googleLoginControllerElement).scope(); 
    var controller = angular.element(googleLoginControllerElement).controller(); 

    ctrlScope.$apply(function() { 
     controller.signinCallBack(authResult); 
    }); 
} 

但是當我移動控制器的指令定義的定義我無法找到一個方法來做到這一點（新控制器定義移動到指令）後，代碼：

var googleLogin = angular.module('GoogleLogin', []); 

googleLogin.directive('googleLogin', function() { 
    return { 

    restrict: 'E', 
    controller: function() { 
    // Initialize google login api 
    (function() { 
     var po = document.createElement('script'); 
     po.type = 'text/javascript'; 
     po.async = true; 
     po.src = 'https://apis.google.com/js/client:plusone.js'; 
     var s = document.getElementsByTagName('script')[0]; 
     s.parentNode.insertBefore(po, s); 
    })(); 

     /* 
     * 1: not logged in. 
     * 2: logged in. 
     * 3: login failed. 
     * 4: logout failed. 
     */ 
     this.state = 1; 

     this.signinCallBack = function(authResult) { 
     if (authResult['status']['signed_in']) { 
      console.log('authResult: ' + JSON.stringify(authResult)); 
      this.state = 2; 
     } else if (authResult.error === "user_signed_out") { 
      console.log('Sign-in state: ' + authResult['error']); 
       this.state = 1; 
     } 
     }; 

     this.logout = function() { 
      try { 
       gapi.auth.signOut(); 
       this.state = 1; 
      } catch(e) { 
       this.state = 4; 
      } 
     }; 

     this.isLoggedIn = function() { 
      return this.state == 2; 
     }; 
    }, 
    controllerAs: 'googleLoginCtrl', 
    templateUrl: '../templates/google_login.html' 
}; 
}); 

在我的HTML我使用該指令是這樣的：

<google-login></google-login> 

謝謝！

Answer 1

您將需要指定您的指令必須使用的範圍。

參考這個文檔：https://docs.angularjs.org/guide/directive

**編輯：**

我給了一個ID，你的元素，這樣我可以得到它的訪問。

<google-login id="mybtn"></google-login> 

&將您的全局函數更改爲。

function signinCallback(authResult) { 
// alert('I came here also inside callback global'); 

    var googleLoginControllerElement = document.getElementById('mybtn'); 
    var ctrlScope = angular.element(googleLoginControllerElement).scope(); 

ctrlScope.$apply(function() { 
     ctrlScope.googleLoginCtrl.signinCallBack(authResult); 
    }); 

    //  ctrlScope.googleLoginCtrl.signinCallBack(authResult); 
    //alert('I came here also inside callback global end'); 

} 

我正在嘗試ctrlScope.controller，但監督一個名稱給它。

Answer 2

你可以嘗試這樣的事情（我不知道是否會工作，讓我知道）：

window.globalSigninCallBack = this.signinCallBack; 

您的指令內：

googleLogin.directive('googleLogin', function() { 
    return { 

    restrict: 'E', 
    controller: function() { 
    // Initialize google login api 
    (function() { 
     var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true; 
     po.src = 'https://apis.google.com/js/client:plusone.js'; 
     var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s); 
     })(); 

     /* 
     * 1: not logged in. 
     * 2: logged in. 
     * 3: login failed. 
     * 4: logout failed. 
     */ 
     this.state = 1; 

     this.signinCallBack = function(authResult) { 
     if (authResult['status']['signed_in']) { 
      console.log('authResult: ' + JSON.stringify(authResult)); 
      this.state = 2; 
     } else if (authResult.error === "user_signed_out") { 
      console.log('Sign-in state: ' + authResult['error']); 
       this.state = 1; 
     } 
     }; 

     window.globalSigninCallBack = this.signinCallBack; 

     this.logout = function() { 
      try { 
       gapi.auth.signOut(); 
       this.state = 1; 
      } catch(e) { 
       this.state = 4; 
      } 
     }; 

     this.isLoggedIn = function() { 
      return this.state == 2; 
     }; 
    }, 
    controllerAs: 'googleLoginCtrl', 
    templateUrl: '../templates/google_login.html' 
}; 
}); 

然後後面的代碼撥打：

window.globalSigninCallBack(authResult); 

，但是這是非常哈克解決方法，我會從來沒有在我的代碼中使用此:)