Sunday, December 1, 2019

TypeError: Cannot convert undefined or null to object

Hi Guys ,

In this blog I will share information related to error :

TypeError: Cannot convert undefined or null to object.

The complete error log is as follows :

main.ts:13 TypeError: Cannot convert undefined or null to object
    at Function.keys (<anonymous>)
    at FormGroup._forEachChild (model.ts:1526)
    at FormGroup._setUpControls (model.ts:1531)
    at new FormGroup (model.ts:1258)
    at new StatusComponent (VM2760 status.component.ts:16)
    at createClass (provider.ts:268)
    at createDirectiveInstance (provider.ts:136)
    at createViewNodes (view.ts:303)
    at callViewAction (view.ts:636)
    at execComponentViewsAction (view.ts:559)
eval @ main.ts:13



You may get this error while using reactive Forms in Angular
Lets look at the code which caused this error .

statusForm = new FormGroup();


You can see the formGroup object is created without passing any parameter to it .

Lets fix this error . We need to add a FormControl to a FormGroup .

The working code is as below .

statusForm = new FormGroup(
    {
      fname : new FormControl('')
    }

  );


Hope this helps .Thanks!

Saturday, November 30, 2019

can't bind to 'formcontrol' since it isn't a known property of 'input'

Hi Guys ,

In this blog I will share information related to error :
can't bind to 'formcontrol' since it isn't a known property of 'input'.

The complete error log is as follows :

Error in /turbo_modules/@angular/compiler@8.0.0/bundles/compiler.umd.js (2479:21)
Template parse errors:
Can't bind to 'formControl' since it isn't a known property of 'input'. ("<label>
Name:
<input type="text" [ERROR ->][formControl]="status">
</label>"): ng:///AppModule/StatusComponent.html@2:21
No provider for NgControl ("<label>
Name:
[ERROR ->]<input type="text" [formControl]="status">
</label>"): ng:///AppModule/StatusComponent.html@2:2



You may get this error while using angular reactive forms .

To fix this error add RectiveFormsModule in the inports array .


@NgModule({
  imports:      [ BrowserModule, FormsModule ,ReactiveFormsModule ],
  declarations: [ AppComponent, HelloComponent, StatusComponent ],
  bootstrap:    [ AppComponent ]
})
export class AppModule { }


Checkout the video on how to fix this error .



Hope this fixes the issue ! Thanks .

Sunday, November 24, 2019

JSX expressions must have one parent element.

Hi Guys ,


This blog is about the error " JSX expressions must have one parent element.

Let's look at the erroneous code .

import React from 'react';

export default ({ name }) => <h1>Hello {name}!</h1>

<input type="text" placeholder="enter asset"/>;


You can see there are two elements <h1> and <input> .
The error is because react does not allow multiple component as a parent component . To fix this issue we can put the two elements under single parent component , like a <div> .

Let's fix the code .

import React from 'react';

export default ({ name }) => <div><h1>Hello {name}!</h1>

<input type="text" placeholder="enter asset"/>  </div>;


The error is gone . Hope this helps , Thanks !



Checkout this error in youtube .


Let me know if you still face error in the comments below .

Saturday, October 19, 2019

ERROR in node_modules/firebase/index.d.ts(4336,38): error TS1005: ';' expected.

Hi Everyone ,

This blog is about the error " ERROR in node_modules/firebase/index.d.ts(4336,38): error TS1005: ';' expected."




I have faced this error while adding firebase to angular .
The solution is to update the typescript to version 3.1.3 .

add firebase to angular

Hi Everyone ,

This blog is about how we can add firebase to angular and access the database .

Install firebase and @angular/fire using npm .

npm i @angular/fire

npm i firebase

Create a file in src/environments/environment/ts


export const environment = {
  production: false,
  
  firebase:{
    apiKey: "your api key",
    authDomain: "test-15b0a.firebaseapp.com",
    databaseURL: "https://test-15b0a.firebaseio.com",
    projectId: "your project id ",
    storageBucket: "test-15b0a.appspot.com",
    messagingSenderId: "846752590782",
    appId: "1:846752590782:web:cdfb301f4daf4448"
  }
};


And then , add firebase to app.module.ts


Next step is to access it via service


Hope this helps . Thanks !

Friday, October 18, 2019

Target container is not a DOM element.

Hi Guys ,


This blog is about the error " Target container is not a DOM element. " 



 The full error in the console log is as follows :

Invariant Violation: Target container is not a DOM element.
    at invariant (https://react-gartc9.stackblitz.io/turbo_modules/react-dom@16.8.0/cjs/react-dom.development.js:55:15)
    at Object.render (https://react-gartc9.stackblitz.io/turbo_modules/react-dom@16.8.0/cjs/react-dom.development.js:20611:36)
    at Object.eval (https://react-gartc9.stackblitz.io/~/index.js:43:13)
    at eval (https://react-gartc9.stackblitz.io/~/index.js:45:4)
    at eval (https://react-gartc9.stackblitz.io/~/index.js:46:3)
    at eval (<anonymous>)

Lets see the erroneous code .

HTML code

<div id="root"></div>

and javascript :


render(<App />, document.getElementById('app'));

To fix this update the render function and specify the id of the HTML element . The working code is as follows :


render(<App />, document.getElementById('root'));



Hops this helps .
Thanks !


Thursday, October 17, 2019

Error response from daemon: No such container:docker

Hi Guys ,

This blog is about the issue "Error response from daemon: No such container:"
I got this error while using docker , I had an docker container which I tried to stop using the command

docker stop myContainer

But instead of stopping it docker gave an error message like
Error response from daemon: No such container:myContainer .

Later I have found out that the docker container name was incorrect .

So I did docker ps

And I got the list of docker containers .
I checked the name of the container which needs to be stopped under the names column . I am able to stop the container .



The second situation where I got the same error is when I tried to start the docker container using the command
start docker myContainer .
Same as above the name is wrong , hence the error .

Watch the video for more details .

ec2-user@ec2 Permission denied