爲什麼這個ng-click不起作用？

Im使用angular與ui-bootstrap模塊安裝，我使用這modal，我想要一個具有ng-click指令的按鈕，但是當我點擊它時什麼也沒有發生。爲什麼這個ng-click不起作用？

繼承人我的代碼

<script type="text/ng-template" id="profileModal.html"> 
     <div class="modal-header"> 
      <h3 class="modal-title">Profile</h3> 
     </div> 
     <div class="modal-body" ng-bind-html="content"> 

     </div> 
     <div class="modal-footer"> 
      <button class="btn btn-warning" type="button" ng-click="close()">Cancel</button> 

     </div> 
</script>

的JavaScript控制器

 if(comparisons.isFollowed){ 
     outputHTML += '<h5>Follows you</h5>'; 
    } 
    if(!comparisons.doesFollow){ 
    outputHTML += "<a ng-click='followUser()' href='#' class='btn btn-success space'>Follow User</a>"; 
    }else{ 
     outputHTML += "<button type='button' ng-click='unfollowUser' class='btn btn-warning space'>Unfollow User</button>"; 
    } 
    if(!comparisons.areFriends){ 
     outputHTML += "<button type='button' ng-click='friendRequest' class='btn btn-success space'>Send friend request.</button>"; 
    }else if(comparisons.hasRequest){ 
     if(comparisons.sentRequest == currentUser){ 
     outputHTML += "<button type='button' ng-click='cancelRequest' class='btn btn-warning space'>Cancel friend request.</button>";  
     }else{ 
     outputHTML += "<button type='button' ng-click='acceptRequest' class='btn btn-success space'>Accept friend request</button>"; 
     outputHTML += "<button type='button' ng-click='declineRequest' class='btn btn-warning space'>Decline friend request</button>"; 
     } 
    } 
    } 

    $scope.content = $sce.trustAsHtml(outputHTML); 


$scope.followUser = function(){ 
    console.log("test"); 
    $http({ url: '/api/v1/user/' + currentUser + '/follow/' + searchedUser, method: 'POST'}).then(function successCallback(response) { 
     console.log(response); 
    }); 
    };

來源

2016-03-10 Rushmead

如何以及在哪裏被定義了'close'功能？ –

對不起，我不是指'Follow User'而不是取消按鈕 – Rushmead

Angular沒有意識到你正在通過Javascript添加的HTML部分，我可以告訴，因爲我使用這種技術有時候在其他角度應用程序中引導角應用程序。你可以做的是將所有這些按鈕添加到你的html文件，並使用ng-show或ng-hide根據這些條件顯示/隱藏它們。 – Felype

您需要從控制器到HTML模板移動你的HTML DOM操作 - 你仍然可以從控制器的模型值驅動它。

因此，像

<a ng-click='followUser()' href='#' class='btn btn-success space' ng-if="comparisons.doesFollow">Follow User</a>

來源

2016-03-10 13:01:07 potatopeelings

不要指派值href屬性。這樣做會改變頁面上的麪包屑/重新加載它。從主標籤中刪除href，如下所示：

<a ng-click='followUser()' class='btn btn-success space'>Follow User</a>

和您的點擊處理程序將工作。

看一看這個的jsfiddle：

http://jsfiddle.net/wvy37/22/

來源

2016-03-10 12:41:40

這不起作用，它只是刷新頁面 – Rushmead

用JSFiddle更新了我以前的答案。 –

謝謝，但這仍然沒有工作。可能是因爲它裏面有一個ng-bind-html？不確定。 – Rushmead

因爲您建立的飛行HTML，你需要讓角知道您綁定的元素。我只在一個指令內完成了這個操作，所以我不完全確定控制器的語法（你可以很容易地將這個整體模式轉換成一個指令btw）。

看一看編譯服務： https://docs.angularjs.org/api/ng/service/ $編譯

來源

2016-03-10 13:02:59

爲什麼這個ng-click不起作用？

回答

相關問題