小编Mad*_*jan的帖子

如何将外部库中的资源包含到Angular CLI项目中

我正在尝试下面,但这不起作用,

  "assets": [
    "../node_modules/<external library>/assets/"
  ]

脚本工作正常,但是

 "scripts": [  
    "../node_modules/<external library>/some.js",     
    "startup.js"
 ]

角度版本:2.4.1

Angular CLI:1.0.0-beta.24

有什么建议吗？

我可以使用ComponentResolver和ViewContainerRef加载动态Angular 2组件.

但是我无法弄清楚如何将子组件的任何输入变量传递给它.

parent.ts

    @Component({
     selector: "parent",
     template: "<div #childContainer ></div>"
    })
    export class ParentComponent {
      @ViewChild("childContainer", { read: ViewContainerRef }) childContainer: ViewContainerRef;

      constructor(private viewContainer: ViewContainerRef, private _cr: ComponentResolver) {}

      loadChild = (): void => {
           this._cr.resolveComponent(Child1Component).then(cmpFactory => {               
              this.childContainer.createComponent(cmpFactory);
           });
      }
    }

child1

 @Component({
   selector: "child1",
   template: "<div>{{var1}}</div><button (click)='closeMenu()'>Close</button>"
 })
 export class Child1Component {
    @Input() var1: string;
    @Output() close: EventEmitter<any> = new EventEmitter<any>();

    constructor() {}

    closeMenu = (): void => {
      this.close.emit("");
    }
 }

所以在上面的例子中说loadChild是按一下按钮调用,我可以加载Child1Component,但是如何传递var1child的输入？另外如何订阅 …

通过URLSearchParams的Angular文档,我找到了关于将数组作为参数传递的任何文档.

任何人都可以帮忙吗？

当我使用angular-cli构建项目时,它将所有项目文件捆绑到一个大的主要包中.

我在应用程序中使用了延迟路由,一旦应用程序加载,我就可以正常导航.

有没有一种方法可以根据延迟加载的路由模块将主包分成多个文件？

以下是配置 angular-cli.json

    {
  "project": {
    "version": "1.0.0-beta.15",
    "name": "maddy-test-project"
  },
  "apps": [
    {
      "root": "src",
      "outDir": "dist",
      "assets": "styles/content",
      "index": "default.htm",
      "main": "main.ts",
      "test": "test.ts",
      "tsconfig": "tsconfig.json",
      "prefix": "",
      "mobile": false,
      "styles": [
        "styles.less"
      ],
      "scripts": [
        "styles/wfa-myriad-pro-typekit.js"
      ],
      "environments": {
        "source": "environments/environment.ts",
        "dev": "environments/environment.ts",
        "prod": "environments/environment.prod.ts"
      }
    }
  ],
  "addons": [],
  "packages": [],
  "e2e": {
    "protractor": {
      "config": "./protractor.conf.js"
    }
  },
  "test": {
    "karma": {
      "config": "./karma.conf.js"
    }
  },
  "defaults": {
    "styleExt": "less",
    "prefixInterfaces": false
  } …

如何config在 Angular 2 路由器中为延迟加​​载的模块路由获取路由器？

当我在路由器对象上记录配置时，只记录来自已加载模块的可用路由，

 export class AppComponent {
   constructor(private router: Router){
     console.log(router.config);
   } 
 }

路由器配置

我理解因为延迟加载模块内的路由在运行时解析，因此配置不可用。但是它限制了我们获取配置数据。

有没有一种方法可以在不加载模块的情况下从延迟加载的模块中获取路由数据？或者在 start 中定义所有路由并延迟加载模块？

普朗克

提前致谢！！

我们能够$watch在复杂对象上应用，如何在Angular 2中进行类似操作。

角度1

$scope.data = {name : "somvalue"}
$scope.$watch('data.name', function(newValue, oldValue) {
    scope.counter = scope.counter + 1;
});

角度2

export class MyData{
   name: string;
} 

export class MyComponent implements OnInit {
   @Input() data: MyData;

   constructor(private ds: MyService){
      this.data = ds.data;
   }

   // $watch('data.name', function(newValue, oldValue) {
   //   scope.counter = scope.counter + 1;
   // });
}

现在，如果data.name服务发生变化，如何监视组件本身的变化，请注意数据不是可观察的，它只是一个常规对象。

更新资料

请参阅示例的Plunk

提前致谢！！

如何在没有辅助路线的情况下获取路线信息？场景是关闭辅助路线,为此我正在考虑从当前路线中删除辅助路线信息并导航到新路线,

所以我要找的是aux1-route从当前的路线上剥离.

/route1(aux1:aux1-route;id=123)  -> /route1
/route1(aux1:aux1-route;id=123//aux2:aux2-route) -> /route1(aux2:aux2-route)

app.html

<router-outlet></router-outlet>
<router-outlet name='aux1'></router-outlet>
<router-outlet name='aux2'></router-outlet>

路线配置

{ path: "route1", component: route1Component }
{ path: "aux1-route", component: aux1RouteComponent, outlet: "aux1" }
{ path: "aux2-route", component: aux2RouteComponent, outlet: "aux2" }

Angular 2 version : 2.0.0-rc.5

Angular Router version : 3.0.0-rc.1

还请建议是否有其他方法可以从应用程序的任何位置关闭辅助路由.

提前致谢!!

我们可以使用它的选择器在 Angular 2 中动态加载组件吗？

假设我们有一个像下面这样的组件，

 @Component({
    moduleId: module.id,
    selector: 'my-component',
    templateUrl: 'my-component.html',
    styleUrls: ['my-component.css']   
 })
 export class MyComponent{
 }

我们可以使用它的选择器将它动态加载到容器中吗 my-component

<div #container ></div>

LoadComponent(selector: string){
    // Load using selector?
}

可能需要在 NgModule 中导出组件并在我们想要加载它的地方导入 NgModule。

不确定如何实现这一点，任何正确方向的指针都会非常有帮助。

提前致谢！！