AngularJS - 如何访问指令中 templateUrl 内定义的表单?

2023-12-29

我正在尝试访问指令内的表单以进行验证,因此我想访问 $setPristine,但是,我似乎无法弄清楚如何获取使用 templateUrl 创建的表单。

我有一个 plunker 在这里详细说明了这个问题:http://plnkr.co/edit/Sp53xzdTbYxL6DAue1uV?p=preview http://plnkr.co/edit/Sp53xzdTbYxL6DAue1uV?p=preview

我收到错误:

Controller 'form', required by directive 'testDirective', can't be found!

这是相关的 Plunker 代码:

.js:

var app = angular.module("myApp", []);

app.directive("testDirective", function() {
  return {
    restrict: 'E',
    scope: {},
    templateUrl: "formTemplate.html",
    require: "^form",  // <-- doesn't work
    link: function (scope, element, attrs, ctrl) {
      console.log(ctrl);

      scope.open = function() {
          // Would like to have access to the form here
          // ctrl.$setPristine();
      }
    },
    controller: function($scope) {
      $scope.firstName = "Mark";

      $scope.save = function(form) {
        console.log(form);
      }
    }
  }
})

表单模板.html:

<form name="testForm" ng-click="save(testForm)">
  <input type="text" ng-model="firstName" />
  <br>
  <input type="submit" value="Save" />
</form>

如何将 formTemplate.html 中的表单附加到指令的隔离范围?


http://plnkr.co/edit/41hhRPKoIsZ9C8Y9Yi87?p=preview http://plnkr.co/edit/41hhRPKoIsZ9C8Y9Yi87?p=preview

在您的指令中尝试一下:

var form1 = element.find('form').eq(0);
formCtrl = form1.controller('form');
console.log(formCtrl);

这应该获取表单的控制器。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

AngularJS - 如何访问指令中 templateUrl 内定义的表单? 的相关文章

  • 尝试使用 angularJS 和 c# webapi 从服务器下载文件

    将文件上传到服务器时效果很好 没有损坏的文件 但是 当我下载文件时 除了纯txt 它们起作用 它们的规模不断扩大并变得腐败 经过大量调查后 我不知道可能出了什么问题 我只是写文件 作为响应流并下载 blob 欢迎任何想法 严重依赖此线程来解
  • Symfony2 表单提交后刷新同一页面

    我有一个表单 其内容是从数据库创建的 在我的控制器中我有 Route HR manage projectID name hr manage public function manageHRAction Request request pro
  • Angular UI.Bootstrap 单选按钮在 ng-repeat 中表现得很奇怪[重复]

    这个问题在这里已经有答案了 我在 Angular 的 ui bootstrap 中动态生成无线电模型的选项时遇到问题 我想我可以简单地对数组进行 ng repeat 使用 btn radio 属性的内容 如下所示 in the contro
  • JQuery Mobile - 内联显示 HTML 表单

    Goal 在 Jquery Mobile 中的同一行显示文本框和提交按钮 Problem 它们不会显示在同一行 我曾多次尝试在同一行显示文本框和提交按钮 但它从未起作用 这是我的代码和我使用的组合
  • 以编程方式更改模型时,AngularJS 自定义验证不会触发

    我创建了一个自定义验证器 要求日期必须是过去的日期 当手动在字段中输入日期时 验证似乎效果很好 但是 如果我以编程方式输入更改日期 直接更改模型而不是在字段中键入 则验证不会触发 我相信我正在按照文档中的指示执行自定义验证指令 这是一个js
  • jQuery 和 AngularJS:将事件绑定到更改的 DOM

    在 AngularJS 的 DOM 中 我在 ng repeat 指令中使用 ng include 它加载 HTML 一切正常 不管怎样 我遇到的一个问题是 我使用 JQuery 最新版本 在 DOM 中的元素上绑定一些鼠标悬停和鼠标单击事
  • 将表类型添加到 JSON 编辑器

    我想了解的代码这个 JSON 编辑器 http mb21 github io JSONedit 并修改它 In 指令 js https github com mb21 JSONedit blob gh pages js directives
  • 如何使用 Vert.x 2.x 启用 CORS

    我正在尝试使用 Angularjs 1 4 5 发出跨域请求 但无法获得成功 我已经配置了 httpprovider config httpProvider function httpProvider httpProvider defaul
  • 从动态 JSON 数据级联父子选择框

    我已经从服务器接收到的 JSON 数据动态创建了一些链接选择框 链接 级联的工作方式是每个选择框都是具有以下属性的命名对象 父属性 作为该选择框对象的父对象的名称 选项 选项对象数组 其中每个对象包含 a 选项值 b 父选项值 当前值映射到
  • 尝试为每一行编写测试用例

    已经编写了跳跃方法的测试用例 但当我看到代码覆盖率报告时 它不会进入onloadend方法seat onloadend 在 createSpyObj 中我调用了 loadend 但它仍然没有进入内部 你们能告诉我如何解决它吗 下面提供我的代
  • VueJS - 验证表单文件上传中的文件大小要求

    我正在使用 Bootstrap Vue 表单制作一个简单的表单 用户可以在其中上传文件 有没有办法验证使用 Vue 表单选择的文件的大小 我想阻止用户上传此类文件 我见过this https stackoverflow com questi
  • 由于运行 Javascript,Firefox 选择下拉列表不断刷新/恢复为默认选项 - AngularJS

    我正在 AngularJS 中构建一个应用程序 但在使用 Firefox 时无法选择下拉菜单 当我单击选择菜单并将鼠标悬停在选项上时 它会将所选选项从光标悬停的选项重置为默认 第一个选项 当选项数量很大时 选择正确的选项变得非常困难 该应用
  • ng-show 令人不安的 div 布局 - angularJS

    我在用ng show notesOpened 如果notesOpened 变量为true 则隐藏div 然而 当隐藏时 它会扰乱布局 有没有办法让 ng show 的行为与 css 属性相同visibility hidden 以便被隐藏的
  • 如何使用 AngularJS 输出 JSON 数组中的元素

    JSON 数组定义在作用域中 scope faq Question 1 Answer1 Question 2 Answer2 HTML div f div Output Question 1 Answer1 Question 2 Answe
  • 拖放以在 angularjs 中排列表格行顺序

    我正在使用 angularjs 并有一个简单的表格 我使用下面的代码 table tr th Name th th Phone th tr tr td friendObj name td td friendObj phone td tr t
  • 从外部javascript正确访问django静态文件

    我有一个使用 AngularJS 的 django 应用程序以及一堆 JavaScript 和模板文件 在我的 django 模板中我可以使用 static 标签来正确引用这些文件 如下所示 myapp app js gt 然而 外部文件本
  • 如何处理 Protractor 中的模态对话框?

    我正在尝试使用sendKeys 在模态对话框上this http www gifteng com login网站 单击后出现此对话框Sign In按钮 我似乎找不到任何方法将焦点切换到盒子上 请参阅gist https gist githu
  • JavaScript 函数参数和范围

    我用下面列出的代码做了一些测试 function foo x alert y var y I am defined outside foo definition foo 上面的代码给了我一个警告 我是在 foo 定义之外定义的 然后另一个测
  • 自定义过滤器在 Angular Hybrid 应用程序中不起作用

    我正在尝试将 AngularJS 1 6 应用程序与 Angular 5 一起转换为混合应用程序 我定义了以下简单过滤器 function use strict var filterId colorPicker angular module
  • JavaScript/Angular 1 - Promise.all 到 async-await

    我在两个变量中分配了对 Web 服务的两次调用referencesPromise and contactTypesPromise onInit 如果需要 我可以为此创建一个新方法 onInit const referencesPromise

随机推荐

  • 如何给一个按钮设置多个标签?

    我有 16 个按钮 我对它们进行标记以将一些术语集与按钮配对并从 sqlite 数据库导入 所以 我这样标记它们 labelForButton and tagForButton class MyStruct public MyStruct
  • CodeIgniter 连接两个表

    我正在尝试使用 CodeIgniter 将两个表连接在一起 我使用 CodeIgniter 用户指南寻求帮助 我遇到了一些问题 仅显示一个表的数据 但我不知道为什么 有人可以帮我吗 这是我的代码 控制器 function getall th
  • Flutter:如何永久注册传感器(并且永远不会取消注册?)

    TL DR 如何让 Android 传感器永久运行 活动 注册我的应用程序 即使我关闭它 客观的 我正在制作一个 Flutter 应用程序 使用以下方法来计算您的步数计步器 https pub dev packages pedometer包
  • AWS EC2 Autoscaling:定义一个永不终止的主实例

    我使用具有自动缩放和负载平衡功能的 EC2 来托管我的 Web 应用程序 为了保证EC2实例之间的一致性 我只想允许从一个实例访问管理界面 因此所有写操作都在该实例上执行 然后其他实例定期下载已更改文件的副本 所以这是我的问题 我可以在我的
  • 如果参数等于这个字符串,定义一个像这个字符串的变量

    我正在做一些 bash 脚本 现在我得到了一个变量调用source和一个名为samples 像这样 source country samples US Canada Mexico 因为我想扩大源的数量 并且每个源都有自己的样本 所以我尝试添
  • 在 PHP 中使用 google image API 获取图像搜索结果的第一个 URL

    你知道一个 php 脚本 一个类就很好 可以获取 google api 图像搜索的第一个图像结果的 url 吗 谢谢 Example 正如 Sarfraz 所说 我找到了一种使用简单 HTML DOM 从 Google Image 结果中获
  • X11:通过命令行移动现有窗口?

    给定一个 X 客户端窗口 ID 有没有办法从命令行移动该窗口或更改其几何形状 xlsclients a Window 0x3000001 Machine ohm Name Terminal Icon Name foo Command foo
  • 将 DataGridView 值复制到 TextBox

    我试图得到这个问题的答案 但到目前为止没有任何帮助能够做到我想要的 我有这段代码 它的目的是查看所选行并将其列输出到相应的文本框中 private void DataGridView01 SelectionChanged object se
  • 为 REST-ful API 编写单元测试 [关闭]

    Closed 这个问题需要细节或清晰度 help closed questions 目前不接受答案 我正计划为 RESTful API 编写单元测试 我想知道我应该采取的方法 我最关心的方面与数据库状态有关 我的理解是 每次测试的测试目标的
  • 关于垃圾回收。为什么我们需要调用System.gc();?

    当引用的对象不再可供任何变量使用时 会自动调用垃圾收集 但我想知道为什么当自动调用垃圾回收时我们要显式调用 System gc 我们什么时候调用 System gc 你不知道 正如你所说 垃圾收集是自动的 System gc 甚至不强制进行
  • Ajax - 500 内部服务器错误

    我正在尝试在工作中为这个项目学习AJAX 我有一个加载患者正在服用的药物的网站 我递归地调用此 AJAX 函数 以便它将附加一个包含单一药物和 7 天历史记录的新表 我在 FF 和 IE 中执行代码时遇到问题 在镀铬中工作得非常好 我收到了
  • Python3并行处理opencv视频帧

    我有一个视频文件 需要逐帧处理 然后需要在帧中显示结果 目前我正在按顺序进行处理并一一显示帧 现在我想并行处理帧而不是顺序处理 一旦处理了 X 个帧 则 cv2 imshow 必须出现 并且必须以正确的顺序显示已处理的帧 目前我的顺序代码如
  • 有没有办法在禁用按钮时防止文本变灰?

    当我将按钮设置为禁用时 文本变为灰色 之前为黑色 在我的窗口中 结果是当按钮被禁用时文本不可读 我翻遍了 NSButton NSButtonCell NSCell NSControl 的文档 但没有找到任何方法使文本保持黑色 你知道我该怎么
  • Kotlin编译器会编译java文件吗?

    我有一个包含 java 和 kt 文件的项目 Kotlin 编译器会同时编译 java 和 kt 文件 还是只编译我的 kt 文件 No kotlinc仅编译 Kotlin 文件 kt 混合语言项目需要将两者结合起来kotlinc and
  • Angular + VB.NET - 路由不起作用

    所以我正在开发一个使用 AngularJS 和用 VB NET 编写的 Web API 的项目 所有这些工作都很好 直到我们必须维护路由为止 以下代码来自我的 angularApp 它定义了路由 var angularApp angular
  • 如何在 Cloud Run 上使用 Stackdriver 日志记录

    我正在尝试让 stackdriver 日志记录在 Google Cloud Run 完全托管 中运行的简单 Go 应用程序正常工作 但在 CloudRun 日志中看不到 stackdriver 条目 我已经创建了最简单的演示应用程序 htt
  • 使用 minimax 进行 tic-tac-toe 游戏可以使用多少个线程?

    我们以 5x5 井字游戏为例 假设轮到我的人工智能了 然后 我做了 25 步 基本上每个单元格 当然 如果它是合法的 移动 为每次移动创建一个线程 总共 25 个线程 最多 在每次移动时调用 minimax 函数 然后当所有结果都来自每个线
  • Visual C++ 2008 Express 下载链接失效了? [关闭]

    Closed 这个问题是无关 help closed questions 目前不接受答案 我目前正在学习的编程课程使用 Visual C 2008 为了在家工作 我们可以选择获取 Express 版本 我在网站上找不到下载链接 微软的支持也
  • Android 地图 - 限制在 180 度

    我可以将 Google 地图 V2 Android 限制在 180 180 经度 如 iOS MapKit 吗 我不希望它环绕 因为我正在尝试实现 clusterin 算法 而 180 180 度分割会让它变得困难 我希望平移限制在红线处
  • AngularJS - 如何访问指令中 templateUrl 内定义的表单?

    我正在尝试访问指令内的表单以进行验证 因此我想访问 setPristine 但是 我似乎无法弄清楚如何获取使用 templateUrl 创建的表单 我有一个 plunker 在这里详细说明了这个问题 http plnkr co edit S