我想创建自己的身份验证指令，当用户没有所需的角色时隐藏内容。
不幸的是，我得到
Error: Template parse errors:
Can't bind to 'appHasRole' since it isn't a known property of 'div'.
我遵循了每个教程，每个堆栈溢出问题，似乎没有任何帮助。
我创建了指令：
Error: Template parse errors:
Can't bind to 'appHasRole' since it isn't a known property of 'div'.
由于我有多个模块，因此我创建了 SharedModule
import {Directive, ElementRef, Input, TemplateRef, ViewContainerRef} from '@angular/core';
import {AuthService} from '../../../security/auth.service';
@Directive({
selector: '[appHasRole]'
})
export class HasRoleDirective {
role: string;
constructor(private element: ElementRef,
private templateRef: TemplateRef<any>,
private viewContainer: ViewContainerRef,
private authService: AuthService) { }
private updateView() {
if (this.checkPermission()) { …我正在从事 Angular 11 项目。
我知道有 ngIf 指令，如果设置为 true，它只会显示 html 元素，但不会保留间距。
在旧的 AngularJS 中，有 ng-show 和 ng-hide。这些属性将显示/隐藏一个元素，但保持其间距（有效地将 css 设置为可见性隐藏）。但 Angular 不再具有这些属性。相反，他们建议绑定到隐藏属性（https://angular.io/guide/ajs-quick-reference#ng-show）。
然而，这并没有保留间距（在我看来这很奇怪）。
Angular 是否有一个指令可以隐藏元素，同时保留其间距？
我可以添加一个条件类，其中该类的可见性为隐藏，但我试图确认 Angular 是否有这方面的指令/属性。
我在这里擦掉了一个演示：https://stackblitz.com/edit/hide-element-angular
?file=src/app/autocomplete-auto-active-first-option-example.html 这显示了隐藏和 ngIf 没有保留间距，而条件类则保留间距。
就像我说的，我想在自定义指令中使用现有的基于结构指令字符串的语法
<element *ngFor='let x of array;let last = last;'></element>
我没有找到任何详细的文档，说明我们如何在自定义结构指令中解码上述语法。我知道我们可以将此语法与所有结构指令 *xyz 一起使用，但我总是使用 [xyz] 代替。我试图找到 Angular 官方文档但一无所获。
所以我进入他们的代码来理解github 中的 *NgFor，除了他们如何解码语法之外，我得到了一切。
如果您看到选择器，如下所示
@Directive({selector: '[ngFor][ngForOf]'})
@Input()
set ngForTrackBy(fn: TrackByFunction<T>) {
//definition
}
所有输入方法都以选择器前缀开头，例如ngForTrackBy。就只有这样吗？我们必须遵循选择器前缀吗？
如果是，那么我们可以使用这种基于前缀的方法做哪些其他事情？如果不是，那么正确的方法是什么？
尝试在angular js中使用自定义指令匹配密码。尽管我看过几个Google教程，但我无法正常工作。我已经创建了一个Plunker，它显示了它在plunker上不起作用。
HTML：
<div class="form-group" ng-class="{ 'has-error': form.password.$invalid && !form.username.$pristine }">
<label for="password">Password</label>
<input type="password" name="password" id="password" class="form-control" ng-model="user.password" required ng-minlength="6" ng-maxlength="12"/>
</div>
<div class="form-group" ng-class="{ 'has-error': form.confirm-password.$invalid && !form.confirm-password.$pristine }">
<label for="confirm-password">Confirm Password</label>
<input type="password" name="confirm-password" id="confirm-password" class="form-control" ng-model="user.confirmpwd" required equal="{{user.password}}"/>
<span ng-show="user.confirmpwd.$error.equal" class="help-block">Password does not match above</span>
</div>
JAVASCRIPT：
app.directive('equal', [
function() {
var link = function($scope, $element, $attrs, ctrl) {
var validate = function(viewValue) {
var comparisonModel = $attrs.equal;
console.log(viewValue + ':' + comparisonModel);
if(!viewValue …我在为我编写的 Angular 属性指令创建单元测试时遇到问题。该指令称为TrackClickDirective，我正在尝试测试以下内容。
我怀疑这是我的单元测试配置有问题。
请参阅我在 StackBlitz 上的实现，您可以在其中看到测试正在运行：
StackBlitz： https ://stackblitz.com/edit/angular-test-click-on-attribute-directive-with-hostlistener
这是我的单元测试代码 - track-click.directive.spec.ts：
import { Component, ElementRef, DebugElement } from '@angular/core';
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { By } from "@angular/platform-browser";
import { TrackClickDirective } from './track-click.directive';
import { Analytics} from './analytics.service';
class MockAnalytics {
eventTrack() {}
};
class MockElementRef {
}
@Component({
template: '<button appTrackClick>Test</button>'
})
export class TestButtonWithoutNameComponent { }
describe('TrackClickDirective', () => {
let component: TestButtonWithoutNameComponent;
let fixture: ComponentFixture<TestButtonWithoutNameComponent>;
let …