您好我刚开始使用新的角度应用程序,导入指令时遇到问题。这是我的代码:
这是我的引导程序文件:
import { bootstrap } from '@angular/platform-browser-dynamic';
import {CommercifyComponent} from './commercify.component';
bootstrap(CommercifyComponent);
这是我的根组成部分:
import { Component } from '@angular/core';
import { LeftNavigationComponent } from './navigation/components/left-navigation.component';
import { TopNavigationComponent } from './navigation/components/top-navigation.component';
@Component({
moduleId: module.id,
selector: 'commercify',
templateUrl: 'commercify.view.html',
styleUrls: ['commercify.style.css'],
directives: [LeftNavigationComponent, TopNavigationComponent]
})
export class CommercifyComponent {
private ceva = "iom";
}
这是LeftNavigationComponent:
import { Component } from '@angular/core';
import { DropdownDirective } from './../directives/dropdown.directive';
@Component({
moduleId: module.id,
selector: 'left-navigation',
styleUrls: ['left-navigation.style.css'],
templateUrl: 'left-navigation.view.html',
directives: [DropdownDirective]
})
export class LeftNavigationComponent {
private ceva = "iom";
}
左侧导航组件视图:
<li class="nav-item" [dropdown]>
<div class="nav-item-header nav-item-header-active">
<span class="nav-item-icon glyphicon glyphicon-shopping-cart" aria-hidden="true"></span>
<span class="nav-item-text">Catalog</span>
<span class="nav-item-arrow glyphicon glyphicon-menu-right"></span>
</div>
<ul class="nav-item-content nav-item-content-active list-unstyled">
<li class="nav-child-item">
<span class="nav-item-icon glyphicon glyphicon-shopping-cart" aria-hidden="true"></span>
<span class="nav-item-text">Categories</span>
</li>
<li class="nav-child-item">
<span class="nav-item-icon glyphicon glyphicon-shopping-cart" aria-hidden="true"></span>
<span class="nav-item-text">Templates</span>
</li>
<li class="nav-child-item">
<span class="nav-item-icon glyphicon glyphicon-shopping-cart" aria-hidden="true"></span>
<span class="nav-item-text">Products</span>
</li>
</ul>
</li>
最后这是DropdownDirective:
import { Directive, ElementRef, HostListener } from '@angular/core';
@Directive({ selector: '[dropdown]' })
export class DropdownDirective {
public element: HTMLElement;
constructor(element: ElementRef) {
this.element = element.nativeElement;
}
}
当我运行代码时,我收到此错误:
现在我认为这个错误是显而易见的,因为我需要在LeftNavigationComponent中添加指令,但我这样做了。我正在使用角度rc.4。
任何人都知道出了什么问题?
答案 0 :(得分:1)
就这样做
<li class="nav-item" dropdown>
而不是
<li class="nav-item" [dropdown]>