directive 相关问题

许多编程语言和框架使用的“命令”概念。将此标记与语言和/或框架一起使用以指示上下文。 C / C ++预处理器是一种严重依赖指令的语言。他们称之为“pragma”。

拖放指令touchend和touchstart事件目标是相同的

我创建了一个用于拖放的自定义指令,我不使用角度材质的拖放,因为只能垂直或水平拖动。 问题是针对移动触摸、针对 touchstart 和 touc...

回答 1 投票 0

如何像代码中的可替换文本一样处理变量名?

我在某些课程中使用offsetof(这是我别无选择的选择)。该宏需要变量的名称,我想为用户提供命名它的可能性。 模板 康斯特...

回答 1 投票 0

在标题中使用 if 指令

我有一个可用的通用图表。顶点的类型当前定义为: typedef 结构体顶点 { 无效*数据; 字符*标签; 布尔图; } 顶点; 然后可以自定义 void 指针...

回答 1 投票 0

查找 ARM GCC 端口的命令

我对 GNU GCC ARM 编译器还很陌生。我需要找到正确的 ARM 编译器类型(CM4F、CM0 等)。我知道这取决于目标,但为了这个问题的简单性......

回答 1 投票 0

Angular 5 - 指令中的生命周期挂钩

我是 Angular 5 的新手。 我已经为外部 JS 库创建了指令。 但在同一个指令中,我将值绑定到属性。 我正在尝试起诉 ngAfterViewInit 来检测是否...

回答 3 投票 0

找不到类型或命名空间。但参考资料还是有的

目前我在我的 C# 项目中使用 2 个引用: 使用 Czm.Perimetry.Analysis.Core; 使用 Czm.Perimetry.Analysis.IO; 当我在 Visual Studio 中查看我的项目时,没有出现错误。然而...

回答 6 投票 0

在 Angular 中将指令事件从子组件传递到父组件

我有一个父组件(侧边栏)和一个子组件(菜单) 我有一个自定义指令,可以检测是否在元素外部进行了单击: 进口 { 指示, 元素参考, 事件发射器,

回答 1 投票 0

如何在 Angular 的多个模块中使用指令?

创建了一个指令 uppercase-input.directive.ts 并尝试在多个组件中导入/使用它,但出现以下错误 刚刚在这里发布了一个文件(organization.module.ts),有几个...

回答 2 投票 0

控制流语句中术语“指令”的使用

有一篇有用的 JavaScript 指南文章反复将 Break 和 continue 称为“指令”,但我之前只见过它们被称为“控制流语句”。动机是什么...

回答 1 投票 0

AngularJS 自定义指令和控制器方法不起作用,并且在 Chrome 浏览器中无法到达断点

AngularJS 自定义指令和控制器方法附加到 md-fab 滚动返回顶部按钮。一旦页面向下滚动,md-fab 按钮就会变得可见,并在页面响应时隐藏...

回答 1 投票 0

如何使用 intl-tel-input lib 创建自定义电话号码指令

我目前正在尝试创建一个自定义指令,该指令将使用以下库初始化输入:intl-tel-input。 所以我用 Bower 下载了所需的 .js 文件: <p>我目前正在尝试创建一个自定义指令,该指令将使用以下库初始化输入:<a href="https://github.com/Bluefieldscom/intl-tel-input" rel="nofollow noreferrer">intl-tel-input</a>。</p> <p>所以我用 Bower 下载了所需的 <pre><code>.js</code></pre> 文件:</p> <pre><code>&lt;script src=&#34;bower_components/intl-tel-input/build/js/intlTelInput.min.js&#34;&gt;&lt;/script&gt; </code></pre> <p>然后我创建我的输入:</p> <pre><code>input type=&#34;tel&#34; class=&#34;form-control&#34; id=&#34;tel&#34; name=&#34;tel&#34; ng-model=&#34;informations.tel&#34; ng-keyup=&#34;checkPhoneFormat()&#34; ng-click=&#34;checkPhoneFormat()&#34;&gt; And I&#39;m initializing it at the beginning of my controller like this : angular.element(&#39;#tel).intlTelInput({ validationScript: &#34;../../bower_components/intl-tel-input/lib/libphonenumber/build/isValidNumber.js&#34;, preferredCountries: [&#39;en&#39;, &#39;fr&#39;] }); </code></pre> <p>我的问题是,当我尝试访问 <pre><code>informations.tel</code></pre> 模型时,它始终是未定义的。看来输入不会动态更新模型值。</p> <p>所以我必须写这样的东西来将我的输入字段的实际值与我的未更新的模型值绑定:</p> <pre><code>$scope.checkPhoneFormat = function(){ $scope.informations.telephone = angular.element(&#39;#telephone&#39;).val(); ...} </code></pre> <p>可能没问题,但我想创建一个自定义指令来初始化此类输入,例如:</p> <pre><code>app.directive(&#39;phoneInput&#39;, function (PhoneFactory) { return { require: &#39;ngModel&#39;, restrict: &#39;A&#39;, scope: { phoneNumber: &#39;=&#39; }, link: function (scope, element, attrs, ctrl) { element.intlTelInput({ validationScript: &#34;../../bower_components/intl-tel-input/lib/libphonenumber/build/isValidNumber.js&#34;, preferredCountries: [&#39;en&#39;, &#39;fr&#39;] }); ctrl.$parsers.unshift(function(viewValue) { console.log(viewValue); }); } }; }); </code></pre> <p>但是由于 <pre><code>ngModel</code></pre> 未定义,因此永远不会到达初始化函数。</p> <p>我该如何解决这个问题?</p> </question> <answer tick="true" vote="12"> <p>你是对的,模型不会自动更新。 你可以制定这样的指令</p> <pre><code>app.directive(&#39;intlTel&#39;, function(){ return{ replace:true, restrict: &#39;E&#39;, require: &#39;ngModel&#39;, template: &#39;&lt;input type=&#34;text&#34; placeholder=&#34;e.g. +1 702 123 4567&#34;&gt;&#39;, link: function(scope,element,attrs,ngModel){ var read = function() { var inputValue = element.val(); ngModel.$setViewValue(inputValue); } element.intlTelInput({ defaultCountry:&#39;fr&#39;, }); element.on(&#39;focus blur keyup change&#39;, function() { scope.$apply(read); }); read(); } } }); </code></pre> <p>可以这样称呼</p> <pre><code>&lt;intl-tel ng-model=&#34;model.telnr&#34;&gt;&lt;/intl-tel&gt; </code></pre> <p>这是一个<a href="http://plnkr.co/edit/KZzTURvvcEWl7XiNzLwC?p=preview">Plunker</a></p> </answer> <answer tick="false" vote="4"> <p>有一个新指令,称为 International-phone-number @ <a href="https://github.com/mareczek/international-phone-number" rel="nofollow">https://github.com/mareczek/international-phone-number</a></p> <p>请结帐,欢迎任何贡献</p> </answer> <answer tick="false" vote="4"> <p>我们中的一些人使用了 Marks 的指令,但缺乏测试以及 jquery 在头部所需的位置导致了问题,因此创建了 <pre><code>ng-intl-tel-input</code></pre>:</p> <p><a href="https://github.com/hodgepodgers/ng-intl-tel-input" rel="nofollow">https://github.com/hodgepodgers/ng-intl-tel-input</a></p> <p>检查一下,它的单元和功能都用量角器进行了测试 在这里玩一下:</p> <p><a href="http://hodgepodgers.github.io/ng-intl-tel-input/" rel="nofollow">http://hodgepodgers.github.io/ng-intl-tel-input/</a></p> </answer> <answer tick="false" vote="2"> <p>马克的指令对我有用: <a href="https://github.com/mareczek/international-phone-number" rel="nofollow">https://github.com/mareczek/international-phone-number</a></p> <p>intl-tel-input(至少在 v3.6 中)的一个问题是,它不会正确格式化您初始化时使用的电话号码*,除非您前面有一个加号(“+”)。这会导致我的用户出现奇怪的行为。我将标准化的电话号码(没有加号)存储在数据库中,因此我需要一个技巧来解决这个问题。我没有在服务器上格式化,而是选择在前端格式化电话号码。我在 Mark 的指令中添加了以下内容以获得我需要的行为:</p> <pre><code>var makeSureInitialValueStartsWithPlusSign = function() { var clear_watcher = scope.$watch(attrs.ngModel, function(changes) { elem_val = element.val(); if (elem_val &amp;&amp; elem_val[0] != &#34;+&#34;) { element.val(&#34;+&#34; + changes); clear_watcher(); } }); }; makeSureInitialValueStartsWithPlusSign(); </code></pre> <p>谢谢马克</p> <p>*正确地说,我的意思是将“19734566789”转换为“+1 973-456-6789”。 int-tel-input 将“19734566789”转换为“1 973-456-6789”(不带 pus)。当用户去编辑它时,他们会遇到奇怪的行为,因为加号不存在。</p> </answer> </body></html>

回答 0 投票 0

如何向 Angular HTML 元素选择器指令添加参数?

我有一个简单的指令,其中选择器是一个img。 @指示( { 选择器:'img' } ) 导出类 ImageDirective { ... } 如何向该指令添加布尔参数? 我尝试过 @Inp...

回答 1 投票 0

如何更改传单指令上的默认图标引脚?

我想知道是否可以更改默认图标(蓝色),在应用程序初始化时使用另一个自定义图标,我阅读了有关如何更改的信息,但我想要整个应用程序的自定义图标。 超文本标记语言 &l...

回答 4 投票 0

NG-SELECT 禁用不使用 Angular 12 的指令

我正在尝试通过指令禁用 ng-select 。谁能建议我该怎么做? 这是我的代码,这是示例。我正在尝试。 设置超时(()=> { 常量 selectElement =...

回答 1 投票 0

Visual Studio 中的全局忽略拼写指令

在 Visual Studio 2022 中,您可以在文件中添加指令 // Ignore Spelling: WordToIgnore 来忽略所述单词。有没有办法在全球范围内做到这一点的解决方案?我不想将其添加到...

回答 1 投票 0

NG-SELECT 禁用不使用 Angular 指令

我正在尝试通过指令禁用 ng-select 。谁能建议我该怎么做? 这是我的代码,这是示例。我正在尝试。 设置超时(()=> { 常量 selectElement =...

回答 1 投票 0

Angular 中如何基于自定义指令缓存组件并重用?

我有一个自定义指令,用于评估用户访问组件的权限,例如 ngIfPerm。 设置 ngIfPerm(val) { // 设置值 if (/*条件成立*/) { this.viewContainer.

回答 1 投票 0

有没有办法以角度有条件地设置所需的输入?

我想要实现的是仅在给出另一个输入时才需要组件/指令输入,例如: @Input() 名称!:字符串; @Input({ required: name!!}) surname!:string; 这是吗

回答 2 投票 0

在 Angular 7+ 上使用 Enter 键移动到 ng-template 下的下一个字段

我得到以下信息:无法读取未定义的属性(读取“焦点”) 因此,我使用 console.log(nextField.nativeElement) 控制台记录了 nextField.nativeElement 并得到了未定义 我的...

回答 1 投票 0

angularjs 自定义指令不起作用

我将自定义属性添加到我的应用程序中,如下所示 '使用严格'; myApp.directive('可定向', function () { 返回 { 限制:'A', 链接:函数(范围、元素、属性、控制...

回答 3 投票 0

© www.soinside.com 2019 - 2024. All rights reserved.