Reputation: 119

Angular 2 CLI variables don't get updated

First of all, I'm totally new to Angular 2 and yesterday I tried using the Angular CLI for my first project ever, and failed. The Angular CLI seems to not be working for me - what I mean, the variables are not getting updated in my views.

I did the standard procedure here:

ng new projectname
cd projectname
npm start

The server at localhost:4200 starts and then I tried adding a new element - a paragraph - to the /src/app/app.component.html template:

    <p>This text gets displayed</p>

The CLI informed me that everything is fine and the browser refreshed automatically, and then I saw the default "app works!" heading and my new paragraph with text inside.

But then, I decided to change the title variable in app.component.ts file, so my new class declaration looked like this:

    export class AppComponent {
        title = 'New App Title!';
    }

The CLI again told me that everything is fine, but no changes were seen in the browser. I refreshed the page manually, but no changes were present - the heading still said "app works!".

So I tried adding a new variable to the file:

   otherText = "some other text";

Then added another paragraph to my template:

   <p>New text: {{otherText}}</p>

The paragraph got shown on the webpage, but the {{otherText}} variable contents were missing. The page looked like this:

    <h1>app works!</h1>
    <p>this text gets displayed</p>
    <p>New text: </p>

Does anyone know what might be the problem here? What can I do to make the variables work? I don't have this kind of problem when I work with the standard quickstart package, only with the CLI.

I'm on a Windows 10 machine, I tried updating Node.js and NPM but that didn't help.

@edit: The variables actually get updated, but I have to start the server with ng serve, and I have to kill it and re-start it every time I make a change to a variable to see the changes.

Upvotes: 2