我有一个指令,其中包含一个带有表单的转换.我想从指令访问表单,但它是未定义的.
如何访问transclude的范围？
我刚开始有角度,所以也许我想做的不是最佳做法？
我做了一个简单的演示来说明我正在尝试做什么.
https://plnkr.co/edit/wzq5oFTuoAqVJMF2RUy2?p=preview
<my-directive>
<form role="form" name="myForm" ng-submit="submit()">
<input type="text" id="myInput" ng-model="myInput" />
<input type="submit" value="Submit" />
</form>
</my-directive>
var myApp = angular.module('myApp',[]);
myApp.controller('myController',function myController($scope){
});
myApp.directive('myDirective',function(){
return {
template: '<div ng-transclude></div>',restrict: 'E',transclude: true,replace: true,link: function (scope,element,attrs) {
scope.submit = function(){
debugger;
var myForm = scope.myForm; //myForm is undefined
}
}
}
});
解决方法
您应该使用link参数而不是link函数中的scope参数来访问dom元素.
var myForm = element[0].querySelector('form')
要么
var myForm = element[0].children.myForm
将为您提供表单元素的句柄.我推荐前者.
