在我的项目中我更多地使用部分页面.我无法在文本框控件上设置自动对焦,而它在普通页面中工作.
这是我的部分页面视图：
<body ng-app="app" ng-controller="myCtrl">
<section>
<input type="text" focus-me/>
<input type="text" />
<a ng-click="show()">click</a>
<section>
<section ng-show="show">
<input type="text" focus-me/>
</section>
</body>
这是我的js：
var app = angular.module("app",[]);
app.controller('myCtrl',function($scope) {
});
$scope.show = false;
$scope.show = function() {
$scope.show = true;
};
angular.module('ng').directive('focusMe',function($timeout) {
return {
link: function ( scope,element,attrs ) {
$timeout( function () { element[0].focus(); } );
}
};
});
1)焦点 – 我在html的第一部分工作但不在第二部分工作,因为它通过ng-show作为局部视图显示.
2)当我使用ng-repeat时,焦点转到最后一项,但它需要在第一项中设置.
有谁可以帮我解决这两个问题？
解决方法
你的第一个问题是因为虽然ng-show控制你是否可以在视图中看到dom元素,但它实际上是在dom中,因此你的指令将在放入dom时运行.如果你使用ng-if那么它将按预期工作.
第二个问题实际上是按设计工作的.你的指令调用立即超时来关注元素,它们都在ng-repeat中工作.它关注最后一个的原因是因为这是发出超时焦点事件的最后一个.
如果只希望聚焦列表中的第一个,那么可以使用$first变量使指令仅对列表中的第一个元素起作用.
