[Angular] 사용자가 선택한 구성 요소를 클릭하여 각도가 2 인 동적 탭



Answers

나는 의견에 대해 충분히 냉담하지 않다. 나는 rc2에서 일하기위한 받아 들인 대답에서 고사포를 고쳤다. 멋진 소식은 없지만 CDN에 대한 링크가 끊어진 것뿐입니다.

'@angular/core': {
  main: 'bundles/core.umd.js',
  defaultExtension: 'js'
},
'@angular/compiler': {
  main: 'bundles/compiler.umd.js',
  defaultExtension: 'js'
},
'@angular/common': {
  main: 'bundles/common.umd.js',
  defaultExtension: 'js'
},
'@angular/platform-browser-dynamic': {
  main: 'bundles/platform-browser-dynamic.umd.js',
  defaultExtension: 'js'
},
'@angular/platform-browser': {
  main: 'bundles/platform-browser.umd.js',
  defaultExtension: 'js'
},

https://plnkr.co/edit/kVJvI1vkzrLZJeRFsZuv?p=preview

Question

구성 요소가 제목을 사용하여 등록 할 수있는 탭 시스템을 설정하려고합니다. 첫 번째 탭은받은 편지함과 같으며 사용자를 위해 선택할 수있는 많은 액션 / 링크 항목이 있으며 이러한 각 클릭은 클릭 할 때 새로운 구성 요소를 인스턴스화 할 수 있어야합니다. 액션 / 링크는 JSON에서 제공됩니다.

인스턴스 생성 된 구성 요소는 그 자체를 새 탭으로 등록합니다.

이것이 '최고의'접근법인지 확신 할 수 없습니까? Sofar 유일한 가이드는 내가 본 적이 정적 탭에 대한 도움이되지 않습니다.

지금까지 나는 메인에서 부트 스트래핑 된 탭 서비스 만 가지고 앱 전체에 지속될 것 같습니다 ~ 이런 식으로 보입니다.

export interface ITab { title: string; }

@Injectable()
export class TabsService {
    private tabs = new Set<ITab>();

    addTab(title: string): ITab {
        let tab: ITab = { title };
        this.tabs.add(tab);
        return tab;
    }

    removeTab(tab: ITab) {
        this.tabs.delete(tab);
    }
}

질문 :

1)받은 편지함에 새로운 (다른) 탭을 만드는 동적 목록을 만들려면 어떻게해야합니까? 나는 DynamicComponentBuilder가 사용될 것이라고 추측한다.

2)받은 편지함에서 생성 된 구성 요소 (클릭시)는 탭으로 등록되고 표시 될 수 있습니까? 나는 콘텐츠를 추측하고 있지만 사용 방법에 대한 정보는 많이 찾을 수 없습니다.

편집 : 명확히하려고

받은 편지함을 메일받은 편지함으로 생각하고, 항목을 JSON으로 가져와 여러 항목을 표시합니다. 항목 중 하나를 클릭하면 해당 항목 작업 '유형'으로 새 탭이 만들어집니다. 그런 다음 형식이 구성 요소입니다.

편집 2 : 이미지

http://i.imgur.com/yzfMOXJ.png




Links