Angularjs 表单。$已提交未处理转包元素

我有这样的想法：

<my-directive name="form"><div ng-if="form.$submitted"></div></my-directive>

在我的指示中：

angular.directive('myDirective', function() {
    return {
        template: '<form name="{{ name }}" ng-transclude></form>',
        transclude: true,
        scope: {
            name: '@'
        },
        link: function(scope) {
            console.log(scope.form.$submitted); //works here
        }
    }
});

angular.directive（'myDirective'，function（）{
返回{
模板：“”，
是的，
范围：{
姓名：'@'
},
链接：功能（范围）{
console.log（scope.form.$submitted）；//在这里工作
}
}
});

表单。$submitted

此处似乎没有定义？但它是在指令的范围内定义的？如何从HTML访问

表单。$submitted

谢谢

被转移的（带有

ng transclude

）内容的作用域与指令的隔离作用域不同

您可以手动转移并将隔离范围应用于转移的内容：

template: '<form name="{{ name }}"></form>',
transclude: true,
scope: {
   name: "@"
},
link: function(scope, element, attrs, ctrls, transcludeFn){
   transcludeFn(scope, function(contentClone){
     element.find("form").append(contentClone);
   });
}

模板：“”，
是的，
范围：{
名称：“@”
},
链接：函数（范围、元素、属性、ctrls、transcludeFn）{
transcludeFn（范围、功能（contentClone）{
元素.find（“form”）.append（contentClone）；
});
}

但这对指令的用户来说有点尴尬，因为现在他们有HTML，它引用了一些“神奇”变量（当然是由指令定义的），这些变量对于观察HTML的人来说并不明显：

<my-directive name="form">
   <pre>{{form}}</pre>
</my-directive>

{{form}}

在这里，

{{form}

所指的内容并不明显