調用jQuery函數

我有一個按鈕下當點擊顯示通知等一個小的彈出調用jQuery函數

<button id="element" type="button" onclick="ShowNotifications()" class="btn btn-default" data-container="body" data-toggle="popover" data-placement="bottom" data-content="Text inside popup">Notifications</button> 
<script type="text/javascript"> 
    function ShowNotifications() { 
     $('#element').popover('open'); 
    } 
</script>

我的目的是顯示這個彈出無需點擊按鈕每隔幾秒鐘，但是從AngularJS控制器。

var showPop = function() { 
    //how can i call that jQuery function here ?? 
    $timeout(showPop, 1000); 
} 
$timeout(showPop, 1000);

與以下溶液試過

app.directive("showNotifications", ["$interval", function ($interval) { 
    return { 
     restrict: "A", 
     link: function(scope, elem, attrs) {   
      $interval(function() { 
       $(elem).popover("open"); 
       alert('hi'); 
      }, 1000); 
     } 
    }; 
}]);

還包括在腳本

<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet" /> 
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script> 

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script> 

<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"></script> 


<script src="js/app.js"></script> 
<script src="js/postsService.js"></script> 
<script src="js/directive.js"></script> 

<script src="js/controllers.js"></script>

使用指令這樣

<button id="element" type="button" class="btn btn-default" data-container="body" data-toggle="popover" data-placement="bottom" data-content="Friend request 1" **show-notifications**>Live Notifications</button>

我看到一個錯誤「的對象有沒有方法酥料餅」

來源

2014-03-28 user804401

這種東西值得一個指令。不要把你的控制器中的ui邏輯。另外，不需要遞歸調用，angular現在支持'$ interval'。 –

指令用於DOM操作：

<button show-notifications>

而且該指令而不是一個$的

.directive("showNotifications", ["$interval", function($interval) { 
    return { 
     restrict: "A", 
     link: function(scope, elem, attrs) { 
      //On click 
      $(elem).click(function() { 
       $(this).popover("open"); 
      }); 

      //On interval 
      $interval(function() { 
       $(elem).popover("open"); 
      }, 1000); 
     } 
    } 
}]);

來源

2014-03-28 13:36:26 tymeJV

我對此表示贊同，我將通過說'link'的主體應該調用'$ interval（showPopup，1000）'來擴展它，這真的是問題所在。 –

@JoeMinichino - 更新後顯示點擊和間隔 – tymeJV

我試過了代碼，我發現錯誤「對象沒有方法彈出」如果我把警報我能看到警報。我還包括了所有的腳本，我修改了代碼，請看上面的 – user804401

只需將鑰匙字角

angular.element("#id").val()

來源

2015-03-22 11:56:10

我想要使用像這樣的angular.element（「＃btn」）。click（function（event）{alert（「hi」）;} ）;但jqLite不支持點擊方法....什麼可以是其他選項。請建議。 –

有沒有必要使用jQuery的使用ng-click =「yourFunction（）」其中yourFunction（）在控制器中定義，如
$ scope.yourFunction = function（）{ alert（「hi」）; }; –

thanx it works –

可以遵循以下步驟

var jq = $.noConflict();

然後創建任何規則的角模塊和控制器，並創建控制器，我們可以將其用於調用任何jQuery函數，例如內部的功能我想添加一個類到div元素。

angular.module('myApp',[]).controller('hello',function($scope){ 
      $scope.name = 'Vikash'; 
      $scope.cities = ['Delhi','Bokaro','Bangalore']; 

      $scope.hide = function(){ 
       jq('#hideme').addClass('hidden'); 

      } 
     });

我們將創建一些常規的html來利用該方法與控制器。

<body ng-controller="hello"> 
    <div class="container" id="hideme"> 
     Hello Dear 
    </div> 
    <button ng-click="hide()">Hide Hello</button> 
</body>

現在，在這裏你可以看到，我們對從jQuery在$ SCPE的控制器和部分聲明的函數內部調用addClass方法。

來源

2015-10-17 21:23:58

這太好了。你也可以寫出'jQuery'而不是'noConflict'，所以它看起來像這樣：'jQuery（'＃hideme'）。addClass（'hidden'）;'' –

調用jQuery函數

回答

相關問題