Nishu Goel NishuGoel

## DI
@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule
  ],
  providers: [DataService],
  bootstrap: [AppComponent]
})

## componentdefinition
const el = document.createElement('app-instruction-card');
const cmp = new AppInstructionCardCmp();

renderComponent(el, cmp);

if(ctx.val !== oldValue) {
  cmp.value = ctx.val;
  oldValue = cmp.value;
  ng.updateView(el, cmp);
}

## useInNewWebComp
import '@nishugoel/my-web-comp/my-web-comp.js';

class NewCustElement extends LitElement{
  render(){
    return html`
      <my-web-comp></my-web-comp>       // Using our custom element inside the implementation of another custom element
    `;
  }
}
customElements.define('new-cust-ele', NewCustElement);

## gist:983b8372fcc378792e55f0fe2ac786a2
<html>
<head>
  <script type="module" src="node_modules/package-name/my-web-comp.js"></script>
</head>
<body>
  <my-web-comp></my-web-comp>
</body>
<html>

## useLitElelocally
<html>
<head>
  <script type="module" src="/path/to/my-web-comp.js"></script>
</head>
<body>
  <my-web-comp></my-web-comp>
</body>
</html>

## gist:6349821760fe17fdafb6466a08ed4de5
@customElement('my-web-comp')
export class myWebComp extends LitElement {


  @property()
  compProp = 'hello';

  render(){
    return html`<p>${this.compProp}</p>`;
  }

## litEl
export class myWebComp extends LitElement {
  render() {
    return html `<div>text here</div>`
  }
}

## gist:2d7bc5c411342d1724c4923c5d336ca4
canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean | UrlTree {
  const url = 'dest';
  const tree: UrlTree = this.router.parseUrl(url);
  return tree;
}

## gist:a0d39396964be519fe5ec9038daac604
export type RunGuardsAndResolvers = 'pathParamsChange' | 'paramsChange' | 'paramsOrQueryParamsChange' | 'always';

## gist:46beea3d9e698848d5b172d413143aaa
Object.keys(containee).every(key => containee[key] === container[key]);

          //changed to

Object.keys(containee).every(key => equalArraysOrString(container[key], containee[key]));
	@NgModule({
	declarations: [
	AppComponent
	],
	imports: [
	BrowserModule
	],
	providers: [DataService],
	bootstrap: [AppComponent]
	})
	const el = document.createElement('app-instruction-card');
	const cmp = new AppInstructionCardCmp();

	renderComponent(el, cmp);

	if(ctx.val !== oldValue) {
	cmp.value = ctx.val;
	oldValue = cmp.value;
	ng.updateView(el, cmp);
	}
	import '@nishugoel/my-web-comp/my-web-comp.js';

	class NewCustElement extends LitElement{
	render(){
	return html`
	<my-web-comp></my-web-comp> // Using our custom element inside the implementation of another custom element
	`;
	}
	}
	customElements.define('new-cust-ele', NewCustElement);
	<html>
	<head>
	<script type="module" src="node_modules/package-name/my-web-comp.js"></script>
	</head>
	<body>
	<my-web-comp></my-web-comp>
	</body>
	<html>
	<html>
	<head>
	<script type="module" src="/path/to/my-web-comp.js"></script>
	</head>
	<body>
	<my-web-comp></my-web-comp>
	</body>
	</html>
	@customElement('my-web-comp')
	export class myWebComp extends LitElement {


	@property()
	compProp = 'hello';

	render(){
	return html`<p>${this.compProp}</p>`;
	}
	export class myWebComp extends LitElement {
	render() {
	return html `<div>text here</div>`
	}
	}
	canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean \| UrlTree {
	const url = 'dest';
	const tree: UrlTree = this.router.parseUrl(url);
	return tree;
	}
	Object.keys(containee).every(key => containee[key] === container[key]);

	//changed to

	Object.keys(containee).every(key => equalArraysOrString(container[key], containee[key]));