我通过以下方式使用了 Angularjs 和 ui.bootstrap popover 功能,
<form name="frm1" role="form" ng-submit='myFunc()' novalidate="novalidate">
.... other inputs go here...
<input type="number" ng-pattern="/^[0-9]+$/" name="testNo" ng-model='testNo' required popover="Locate number here" popover-trigger="focus">
<input type="submit" ng-model='funcBtn' value="Submit" ng-click="submitted = true" ng-disabled="value.length=0">
</form>
问题是由于 popover="Locate number here"popover-trigger="focus"
代码导致的,当我在提交表单后检查时,输入 testNo 的值未传递给 Controller 。
Controller 如下,
app.controller('myCtrl', ['$scope','$location','$log', function($scope,$location,$log)
{
$log.log('testNo', $scope.testNo);
}]);
如果我从此输入中删除弹出窗口代码,它就可以正常工作。我想知道是否有特定的方法在输入中使用弹出框。
使用资源ui.bootstrap示例,输入触发器:http://angular-ui.github.io/bootstrap/
最佳答案
问题在于,当前版本的 AngularJS 对于给定的 DOM 元素只能有一个作用域,并且弹出窗口会创建一个子作用域,然后该子作用域会被其他指令继承。幸运的是,解决方案很简单。只需在指令中引用 $parent.my_var,在您的情况下 ng-model="$parent.$model"
。
这是popover FAQ关于这个问题。
我在自己的自定义指令内部遇到了这个问题,但幸运的是解决方案也很简单:不要引用 $scope.var,而是引用 $scope.parent.var。简单的解决方案,但需要数小时的调试!
关于java - Angularjs UI Bootstrap Popover 阻止输入提交,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25422528/