Question

我从https://www.davebennett.tech/angular-4-input-numbers-directive/创建了一条指令，以便可以限制用户仅在电话号码中输入数字。在src/app/app.sharerd.module.ts文件中，我做了以下代码来导入指令：

import { NumberOnlyDirective } from './number.directive';
declarations: [..., ..., NumberOnlyDirective], ...
export class SharedModule { }

现在，在/src/文件夹下，我创建了名为modules/auth/component/的文件夹。

在auth.module.ts文件夹中的/src/auth/下，我执行了以下操作：

import { NgModule } from '@angular/core';
import { SharedModule } from '../../app/app.shared.module';
...
...

现在，在signup.html下的/src/auth/component/中：

<input type="text" name="phone" myNumberOnly ... > ...
...

我仍然可以在文本框中输入字符/特殊字符等，但是，在console / cli中没有看到任何错误。

Answer 1

在共享模块中使用自定义指令/管道时，还需要将其导出。

基本上在您的教程中，他创建了指令并在app模块中对其进行了声明。但是在您的示例中，您将指令放置在共享模块中，因此您需要将指令放置在声明括号中，而且还要放置在导出文件中。

shared.module.ts ：

@NgModule({
    /* ... */
    declarations: [YourDirective],
    exports: [YourDirective]
    /* ... */
})

Answer 2

三个快速指令调试技巧：

在指令的构造函数中放入debugger;语句。然后，您将确定它何时可以正常工作，并且可以将其删除。
确保您拥有selector: '[magicFeature]'而不是selector: 'magicFeature'
有时您需要重新启动ng serve以确保一切都刷新。

Answer 3

尝试一下：

val kafkaSource = new FlinkKafkaConsumer[MyType]("myTopic", schema, props)
watermark: Watermark[String] = WatermarkStrategy.forBoundedOutOfOrderness(Duration.ofSeconds(20))
kafkaSource.assignTimestampsAndWatermarks(watermark)

Angular 6 numberonly指令不起作用

3 个答案: