没有调用li元素内部的scope函数
scope function inside li element is not getting called
我使用ng repeat生成li,在该li中,我有一个输入类型控件,该控件有一个范围函数fn_btnClose。当我点击按钮时,按钮的点击事件没有被调用,而是李的点击事件被触发。
我在js fiddle做同样的事情,它在那里起作用,但在我的代码没有找到问题所在。工作小提琴链接是
http://jsfiddle.net/rahulrathore1986/udmcv/296/
html如下
<ul id="ulClaimantId" class="TabbedPanelsTabGroup">
<li ng-repeat="claimantDetail in claimantDetailsList" class="TabbedPanelsTab_01" tabindex="0" id="{{claimantDetail.claimantId}}" tabdata="{{claimantDetail.selectedClaimObject}}" attachedworkgroup="{{claimantDetail.Id}}" firstli="{{claimantDetail.firstLi}}" ng-click="OpenWorkGroupTab(claimantDetail.claimantId);">{{claimantDetail.Id}}
<input type="image" id="btnClose_{{claimantDetail.Id}}" src="Content/Images/close-popup.png" style="float:right;margin-left:2px;" data-ng-click="fn_btnClose(claimantDetail.claimantId,$event)" >{{claimantDetail.claimantId}}</input>
</li>
</ul>
我的控制器范围功能在同一个控制器中,就像这个
// Function for closing the tab and it will remove the tab from HTML
$scope.fn_btnClose = function (mint_tabId, e) {
console.log('fnbtnCclobse');
if (mint_tabId != undefined) {
angular.element("#" + mint_tabId).remove();
//get the corresponding close button id and then remove it
var close = "btnClose_" + mint_tabId.replace('liClaimant', '');
angular.element("#" + close).remove();
var inComingTab = this.findAndRemove($scope.ClaimantArrayList, 'claimantId', mint_tabId.replace('liClaimant', ''));
//$scope.ClaimantArrayList.splice(mint_tabId.replace('liClaimant', ''), 1);
if ($scope.ClaimantArrayList.length == 0) {
//If all tabs are closed then hide claim detail div.
$('#dvRustClaimantDetail').hide();
$('#dvBasicFullAdvSearch').show();
}
else {
//populate the data of next claimant tab
if ($scope.ClaimantArrayList != undefined && $scope.ClaimantArrayList.length > 0) {
inComingTab = "liClaimant" + inComingTab;
this.fn_populateTabWdObject(angular.fromJson(angular.element('#' + inComingTab).attr('tabdata')),
inComingTab,
angular.element('#' + inComingTab).attr('attachedworkgroup'),
angular.element('#' + inComingTab).attr('firstli'));
}
}
}
e.stopPropagation();
}
////this function will open the WorkGroup detail div for the tab that has been clicked
$scope.OpenWorkGroupTab = function (tabId) {
console.log('OpenWorkGroupTab');
if (($('#ulClaimantId li').length == 0)) {
// $('#dvRustClaimantDetail').hide();
if (tabId == 'liHomeTab') {
$('#dvBasicFullAdvSearch').show();
}
else {
//$('#dvRustClaimantDetail').hide();
// $('#dvBasicFullAdvSearch').hide();
}
//return false;
}
$('#dvRustClaimantDetail').show();
//Add Close button html for the tabs added
angular.element('#ulClaimantId li').each(function () {
var $this = $(this);
var text = $this.html();
text = text.replace('<', '<').replace('>', '>');
$this.html(text);
});
$('[tabviewdiv]').hide();
if (tabId == 'liHomeTab') {
$('#dvBasicFullAdvSearch').show();
}
else {
var claimantObject = angular.fromJson(angular.element('#' + tabId).attr('tabdata'));
//check if selected Tab is WorkGroup tab then append ClaimantTabid to tabId argument
if (tabId.toLowerCase().indexOf('workgroup') > 0) {
tabId = "liClaimant" + claimantObject.ID;
}
//Gets the Claimant Extra Info and Populates the tab Data
this.ClaimantExtraInformation(claimantObject.ID);
this.fn_populateTabWdObject(angular.fromJson(angular.element('#' + tabId).attr('tabdata')), tabId,
angular.element('#' + tabId).attr('attachedworkgroup'),
angular.element('#' + tabId).attr('firstli'),
$scope.claimantExtraInfoObject);
}
}
您需要在按钮的ng-click:上有一个stopPropagation()
<li ng-repeat="item in items" ng-click="OpenWorkGroupTab(item);">Text of Li
<input type="button" value="btn" style="margin-left:1px;" ng-click="fn_btnClose(item,$event);$event.stopPropagation();">
</li>
相关文章:
- 控制器内部的scope函数不根据视图中的ng模型更新值
- 如何在angular中重复scope函数
- $scope.$on('$routeChangeSuccess'..) 和在 scope 函数中调用方法
- Angular 和 Jasmine - $scope函数未定义
- $scope函数参数从何而来
- 自定义指令调用$scope函数会导致$rootScope:infdig
- 没有调用li元素内部的scope函数
- AngularJS:如何将window.setTimeout插入到scope函数中
- angular$cookieStore在controller$scope函数下不工作
- 如何从指令中的templateUrl运行$scope函数
- Angular.js:存储http.get请求中的变量,以便在不同的$scope函数中全局使用
- 为什么我看不到在$scope函数中定义的$scope变量?
- 我可以在angularjs的$scope函数中写一个this函数吗?
- 无法在ng-repeat中调用$scope函数
- 为什么一些角$scope函数"return&;一个操作
- 如何在angular.js中调用ng-title属性上的scope函数?
- 如何在angular-kendojs中使用href来调用angular的$scope函数
- AngularJS:在$scope函数内等待ng点击事件
- 将$scope函数转换为常规var函数.对性能有任何影响吗
- 如何从angularjs指令中调用$scope函数