2013-05-07 48 views
1

當用戶單擊一個單詞時,會調用displayPopup(),這裏是我創建角度應用程序的位置。我必須在$ scope中添加一些數據$ apply函數。該數據被顯示出來,在彈出的,當我調用$ scope.test()或任何其他功能來更新應用程序,我得到了TypeError: Object #<Object> has no method 'test'在外部Javascript中調用角度控制器功能

我爲什麼不能叫我的方法!?

displayPopup = function(event) { 

    var popup = document.createElement('div'); 
    popup.innerHTML = popupContent; 

    popup.id = "wordly-popup"; 
    popup.style.top = event.clientY + "px"; 
    popup.style.left = event.clientX + "px"; 
    $("body").append(popup); 

    var $injector = angular.bootstrap(popup, ['myApp']); 
    var $scope = angular.element(popup).scope(); 

    $scope.$apply(function(){ 
     $scope.word = getSelectionText(); 
     $scope.contextSentence = currentSentence.innerHTML; 
       $scope.test(); // NOT WORKING 


    }); 

} 

這裏是我的應用程序定義:

var myApp = angular.module("myApp", []); 

myApp.controller("PopupCtrl", function($scope, $http) { 

    $scope.showLoading = false; 
    var currentPOS = null; 

    $scope.setPOS = function(pos) { 
     currentPOS = pos; 
    } 

    $scope.getDetails = function() { 

     if ($scope.word.length == 0) { 
      $scope.definitions = null; 
      $scope.partsOfSpeech = {}; 
     } 

     $scope.showLoading = true; 

     currentPOS = null; 
     $http.get('http://localhost:3000/words/definitions/' + $scope.word).then(function(response) { 
      $scope.showLoading = false; 
      console.log(response.data[1]); 
      $scope.syllables = response.data[1]; 
      $scope.definitions = response.data[0]; 
      $scope.partsOfSpeech = _.uniq(_.pluck(response.data[0], "partOfSpeech")); 
     }); 
    }; 

    $scope.posFilter = function(definition) { 
     if (currentPOS == null) return true; 
     return definition.partOfSpeech == currentPOS; 
    }; 

    $scope.test = function() 
    { 
     console.log("hello!"); 
    } 
}); 

myApp.directive("hovercolor", function() { 
    return function(scope, element, attrs) { 
     element.bind("mouseenter", function(data) { 
      element.css("background-color", "#f89406"); 
      element.css("color", "white"); 
      element.css("cursor", "pointer") 
     }); 

     element.bind("mouseleave", function(data) { 
      element.css("background-color", "transparent"); 
      element.css("color", "black"); 
     }); 
    }; 
}); 

回答

1

你的要求,你剛剛創建並添加到您的文檔的popup範圍,所以當你要求的範圍你得到正是你應該得到的:$rootScope

我假設popupContent包含說明ng-controller="PopupCtrl"的HTML,這可能是您想要的範圍。您可以在popup上設置ng-controller屬性,也可以從popup.firstChild中獲取您想要的範圍。

相關問題