angular2-compiler

“Can't read the url” error for angular2 dynamic components with templateUrl

耗尽温柔 提交于 2019-12-22 08:59:09
问题 Tried to modify soultion from here. It works fine, but if you change template to templateUrl in component, that should load dynamically, you get an error: "No ResourceLoader implementation has been provided. Can't read the url ...". @Component({ selector: 'string-editor', templateUrl: 'app/parts/string.html', //using template URL instead of inline template here }) export class StringEditor { ... } Live example on plunker. Any ideas how to fix this? 回答1: Don't use COMPILER_PROVIDERS , because

Add custom elements and attributes to compiler schema

China☆狼群 提交于 2019-12-20 02:30:19
问题 There are some custom elements and attributes in component template (in this example they are used by third-party non-Angular code): <foo></foo> <div data-bar="{{ bar }}"></div> They cause a compiler error: Template parse errors: 'foo' is not a known element: 1. If 'foo' is an Angular component, then verify that it is part of this module. 2. If 'foo' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' of this component to suppress this message. (" [ERROR ->]<foo><

Angular2 RC5 dynamically compile component with correct module

与世无争的帅哥 提交于 2019-12-10 13:57:19
问题 I'm trying to use the angular2 compiler to dynamically insert a component, which works fine as long as all code is in the default module. But if try to put the component into it's own feature module, it breaks. The injected compiler instance (ModuleBoundCompiler) is bound to the default module not the feature one and I can't override the module in the compiler call, because I can't get a reference to it, due to circular dependencies (feature module exports component, component needs to

How to use RouterModule.forRoot() in Angular2 compiler/cli ngc command

依然范特西╮ 提交于 2019-12-10 13:53:39
问题 Let's say i have the following appRoutingModule: export const routes: Route[] = [ { path: '', component: ApplicationlistComponent } ]; @NgModule( { imports: [ ApplicationsModule, RouterModule.forRoot( routes ) ], exports: [ RouterModule ], declarations: [ApplicationlistComponent] } ) export class AppRoutingModule { } When compiling this with the ngc cli command it will give the following error: Error: Error encountered resolving symbol values statically. Calling function 'RouterModule',

“Can't read the url” error for angular2 dynamic components with templateUrl

夙愿已清 提交于 2019-12-05 12:46:16
Tried to modify soultion from here . It works fine, but if you change template to templateUrl in component, that should load dynamically, you get an error: "No ResourceLoader implementation has been provided. Can't read the url ...". @Component({ selector: 'string-editor', templateUrl: 'app/parts/string.html', //using template URL instead of inline template here }) export class StringEditor { ... } Live example on plunker . Any ideas how to fix this? Don't use COMPILER_PROVIDERS , because it overrides the ResourceLoader . For dynamic loading use the Compiler from core package (which is

recursive dynamic template compilation in angular2

孤人 提交于 2019-12-04 01:50:34
问题 I've based some of my work on the same problem described in here: dynamic template to compile dynamic Component with Angular 2.0 How can I use/create dynamic template to compile dynamic Component with Angular 2.0? The working plunker described in the question above can be found here. The problem occours if the dynamic-detail tries to create another dynamic view that uses dynamic-detail in the template. If i try to do that i get the following exception.: 'dynamic-detail' is not a known element

Add custom elements and attributes to compiler schema

青春壹個敷衍的年華 提交于 2019-12-01 21:50:47
There are some custom elements and attributes in component template (in this example they are used by third-party non-Angular code): <foo></foo> <div data-bar="{{ bar }}"></div> They cause a compiler error: Template parse errors: 'foo' is not a known element: 1. If 'foo' is an Angular component, then verify that it is part of this module. 2. If 'foo' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' of this component to suppress this message. (" [ERROR ->]<foo></foo> <div data-bar="{{ bar }}"></div> "): App@1:4 Can't bind to 'bar' since it isn't a known property

Angular 2: functions/methods on click inside dynamic template (dynamic component)

跟風遠走 提交于 2019-11-29 12:57:32
Following the example below: How can I use/create dynamic template to compile dynamic Component with Angular 2.0? I developed my own template generator, which gets the HTML content directly from a variable. Here it is: http://plnkr.co/edit/2Sv1vp?p=preview Now, my question is... if template content has to interact with the component, for example with a function to execute on click... how can I do that? Here my app.component.ts import { Component } from '@angular/core'; @Component({ selector: 'my-app', template: ` <div> <h2>An app with DYNAMIC content</h2> <hr /> <dynamic-detail [tmpl]="tmpl1"

Angular 2: functions/methods on click inside dynamic template (dynamic component)

江枫思渺然 提交于 2019-11-28 06:45:40
问题 Following the example below: How can I use/create dynamic template to compile dynamic Component with Angular 2.0? I developed my own template generator, which gets the HTML content directly from a variable. Here it is: http://plnkr.co/edit/2Sv1vp?p=preview Now, my question is... if template content has to interact with the component, for example with a function to execute on click... how can I do that? Here my app.component.ts import { Component } from '@angular/core'; @Component({ selector:

Dynamically load HTML template in angular2

杀马特。学长 韩版系。学妹 提交于 2019-11-26 21:59:03
I have created a project using angular-cli which contains AppComponent as follows: import { Component } from '@angular/core'; @Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.css'] }) export class AppComponent { title = 'app works!'; } And app.component.html as <h1> Good Morning, {{title}} </h1> So when I build it with ng build it generates some files like this ./dist/main.bundle.js which contents some code as follows- /* 586 */ /***/ function(module, exports) { module.exports = "<h1>\n Good Morning, {{title}}\n</h1>\n" /***/ }, /* 587 */