2
Привет, может кто-нибудь сказать мне, что я делаю неправильно? Я думаю, что это простая ошибка, но я новичок в угловой, и я не могу ее найти.Нет провайдера для String
ИСКЛЮЧЕНИЕ: Нет провайдера для String! (SwNavItemCmp -> Строка)
export interface SwNavItemModel {
\t name: string;
route: string;
children?: Array<SwNavItemModel>;
}import {SwNavItemModel} from '../models/sw_nav_item_model';
export const NAV_ITEMS_DATA: Array<SwNavItemModel> = [
{ name: 'Home',
\t route: '/Home' },
{ name: 'Offer',
route: '/Offer',
\t children: [
{ name: 'Prices',
\t route: '/Prices' },
{ name: 'Samples',
route: '/Samples' }
]
},
{ name: 'About',
route: '/About',
children: [
{ name: 'Us',
route: '/Us' },
{ name: 'Projects',
route: '/Projects' },
{ name: 'Skills',
route: '/Skills' }
]
},
{ name: 'Contact',
route: '/Contact' }
];import {Injectable} from 'angular2/core';
import {NAV_ITEMS_DATA} from '../data/mock_nav_data';
@Injectable()
export class NavService {
\t getNavData() {
\t \t return Promise.resolve(NAV_ITEMS_DATA);
\t }
}import {Component, OnInit} from 'angular2/core';
import {
ROUTER_DIRECTIVES
} from 'angular2/router';
import {SwNavItemCmp} from './sw-nav-item/sw_nav_item';
import {SwNavItemModel} from '../../../models/sw_nav_item_model';
import {NavService} from '../../../services/nav_service';
@Component({
selector: 'sw-nav',
templateUrl: './components/shared/sw-nav/sw_nav.html',
styleUrls: ['./components/shared/sw-nav/sw_nav.css'],
providers: [NavService],
directives: [ROUTER_DIRECTIVES, SwNavItemCmp]
})
export class SwNavCmp implements OnInit {
public items: Array<SwNavItemCmp> = [];
constructor(private _navService: NavService) {
}
ngOnInit(): any {
this.getNavData();
}
getNavData() {
this._navService.getNavData().then((navData: Array<SwNavItemModel>) => {
console.log(navData);
console.log(Object.keys(navData));
this.addItems(navData);
});
}
addItem(name: string, route: string, children?: Array<SwNavItemModel>) {
console.log();
console.log('name: ' + name);
console.log('route: ' + route);
console.log('children: ' + children);
if(children) {
let childrenItems: Array<SwNavItemCmp> = [];
console.log('childrenItems: ' + childrenItems);
children.forEach((child) => {
console.log('child: ' + child);
childrenItems.push(new SwNavItemCmp(child.name, child.route, null));
console.log('childrenItems: ' + childrenItems);
});
this.items.push(new SwNavItemCmp(name, route, childrenItems));
console.log('Items: ' + this.items);
} else {
this.items.push(new SwNavItemCmp(name, route, null));
console.log('Items: ' + this.items);
}
}
addItems(itemsArray: Array<SwNavItemModel>) {
console.log('ItemsArray: ' + itemsArray);
itemsArray.forEach((item) => {
console.log('item: ' + item);
item.children ? this.addItem(item.name, item.route, item.children) : this.addItem(item.name, item.route, null);
});
console.log('Items: ' + this.items);
}
}import {Component, Input} from 'angular2/core';
import {ROUTER_DIRECTIVES} from 'angular2/router';
@Component({
selector: 'sw-nav-item',
templateUrl: './components/shared/sw-nav/sw-nav-item/sw_nav_item.html',
styleUrls: ['./components/shared/sw-nav/sw-nav-item/sw_nav_item.css'],
directives: [ROUTER_DIRECTIVES]
})
export class SwNavItemCmp {
\t @Input() items: Array<SwNavItemCmp>;
name: string;
route: string;
children: Array<SwNavItemCmp> = [];
constructor(name: string, route: string, children?: Array<SwNavItemCmp>) {
this.name = name;
this.route = route;
this.children = children;
}
}constructor(name: string, route: string, children?: Array) {...
throw error TS2314: Generic type 'Array<T>' requires 1 type argument(s).
/////////////////////////// ///////////////////////////////////
Теперь у меня есть это:
sw_nav.ts
...
export class SwNavCmp implements OnInit {
public items: Array<SwNavItemCmp> = [];
...
}
sw_nav.html
<nav>
<ul class="main-menu">
<li *ngFor="#item of items">
<sw-nav-item [items]="item.children"></sw-nav-item>
</li>
</ul>
</nav>
вопросы: прохожу Должна ли вся вещь InstEd из item.children?
sw_nav_item.ts
import {Component, Input, Inject, Injectable} from 'angular2/core';
import {ROUTER_DIRECTIVES} from 'angular2/router';
@Component({
selector: 'sw-nav-item',
templateUrl: './components/shared/sw-nav/sw-nav-item/sw_nav_item.html',
styleUrls: ['./components/shared/sw-nav/sw-nav-item/sw_nav_item.css'],
directives: [ROUTER_DIRECTIVES]
})
@Injectable()
export class SwNavItemCmp {
@Input() items: Array<SwNavItemCmp>;
name: string;
route: string;
children: Array<SwNavItemCmp>;
constructor(name, route, @Inject(SwNavItemCmp) children: Array<SwNavItemCmp>) {
this.name = name;
this.route = route;
this.children = children;
}
}
вопросы: -Как должен конструктор выглядит? Я считаю, что это неверно. -Как передать данные из ввода в конструктор? -Могу ли я использовать Injector.resolveAndCreateChild() для определения предметов для детей?
SW-нав-item.html
???
вопросы: -Как сделать это рекурсивным? Я хочу, чтобы все sw-nav-item были сами собой.
И основные вопросы: -Где я должен поставить уаг форсунку = Injector.resolveAndCreate (... обеспечить (...), и как должен это выглядит как -Если у меня неправильно структуру или концепцию Как?. для того, чтобы сделать это правильно? Я имею в виду рекурсивные компоненты создания и rendreing.
Что-то не так в моем конструкторе SwNavItemCmp, но я не понимаю, что и почему. – Sakala