如何讓ng-click在動態添加按鈕上工作？

我有一個輸入字段。使用動態添加的按鈕聚焦工具提示彈出窗口。如何使該按鈕工作點擊？如何讓ng-click在動態添加按鈕上工作？

我一直在尋找解決方案，但沒有任何明確的具體例子。

這裏是我的plunkr：http://plnkr.co/edit/UFv6qcg68wD99HXf76xP?p=preview

下面是代碼：

<body> 

<div ng-controller="PopoverDemoCtrl"> 
    <h4>Dynamic</h4> 

    <p>{{message}}</p> 

    <br><button class="btn btn-warning" ng-click="removeMessage()">Remove mesage</button> 

    <br><br> 
    <input type="text" value="Click me!" uib-popover-html="htmlPopover" popover-trigger="focus" class="form-control"> 
    popover-trigger="focus" class="form-control">--> 
</div> 
</body> 
</html>

控制器

angular.module('ui.bootstrap.demo', ['ngAnimate', 'ui.bootstrap']); 
angular.module('ui.bootstrap.demo').controller('PopoverDemoCtrl', function ($scope, $sce) { 

$scope.dynamicPopover = { 
    content: 'Hello, World!', 
    templateUrl: 'myPopoverTemplate.html', 
    title: 'Title' 
}; 

$scope.message = ''; 

$scope.showMessage = function(){ 
    console.log("Simple message"); 
    $scope.message = "Just added text"; 
} 

$scope.removeMessage = function(){ 
    console.log("Simple message"); 
    $scope.message = ""; 
} 

$scope.test = function(){ 
    console.log("test me click") 
} 

$scope.placement = { 
    options: [ 
     'top', 
     'top-left', 
     'top-right', 
     'bottom', 
     'bottom-left', 
     'bottom-right', 
     'left', 
     'left-top', 
     'left-bottom', 
     'right', 
     'right-top', 
     'right-bottom' 
    ], 
    selected: 'top' 
}; 

$scope.htmlPopover = $sce.trustAsHtml('<button ng-mousedown="test()"><b style="color: red">Add message</b></button> to the <div class="label label-success">page</div> content');

}）;

來源

2016-06-01 Octtavius

更換UIB-酥料餅，HTML來UIB-酥料餅的模板和使用，而不是NG單擊納克-mousedown並給予一點延遲關閉popop

<input type="text" ng-model="value" value="{{value}}" uib-popover-template="htmlPopover" popover-trigger="focus" popover-popup-close-delay="1000" class="form-control"> 

<script type="text/ng-template" id="myPopoverTemplate.html"> 
    <div> 
    <button ng-click="test()"><b style="color: red">Add message</b></button> 
    <div class="label label-success">page</div> 
    </div> 
</script>

示例工作代碼。 http://embed.plnkr.co/deN1VjHdXbTKXlqdQ0vt/

關於UIB https://angular-ui.github.io/bootstrap/#/popover

更多信息

來源

2016-06-01 12:25:34

使用UIB-酥料餅的模板，而不是UIB-酥料餅-HTML：

$scope.htmlPopover ='myPopoverTemplate.html'; 


<input type="text" value="Click me!" uib-popover-template="htmlPopover" popover-trigger="focus" class="form-control"> 
    <script type="text/ng-template" id="myPopoverTemplate.html"> 
     <div> 
     <button ng-mousedown="test()"><b style="color: red">Add message</b></button> 
     <div class="label label-success">page</div> 
     </div> 
    </script>

http://plnkr.co/edit/ERjqaV3IJEtTPDQv9c0l?p=preview

來源

2016-06-01 12:10:49

如何讓ng-click在動態添加按鈕上工作？

回答

相關問題