RXjs button click not gettng server response

Question

I have a node js server side demo type application. I am making it by following a tutorial via pluralsight. and using Typescript along with rxjs for reactive programming.

It was working just fine until I tried a button to link with a click event and get a json object to display on client side. I will post the code. Please someone let me know why it is not working.

main.ts

import {Observable} from "rxjs";

let output=document.getElementById('output');
let button=document.getElementById('button');
let click=Observable.fromEvent(button,"click");


function LoadMovies(url:string){

let xhr=new XMLHttpRequest();
xhr.addEventListener("LoadMovies",()=>{
    console.log("yeah");//this is for debugging, and I noticed that this line is never execute so the below lines to put movies to the client site doesnt work either.
    let movies=JSON.parse(xhr.responseText);
    movies.forEach(m => {
        let div=document.createElement("div");
        div.innerText=m.title;

        output.appendChild(div);
    });
})
xhr.open("GET",url);
xhr.send();
}


click.subscribe(
    e=> LoadMovies("movies.json"),
    e => console.log(`error: ${e}`),
    () => console.log("complete")   
);

movies.json

[
{
    "title": "Star Wars"
},
{
    "title": "Star Trek"
},
{
    "title": "Starship Troopers"
}
]

index.html

<html>

<head>
   <title>RxJs</title>
   <style>  
       #circle {
           width: 20px;
           height: 20px;
           border-radius: 50%;
           background-color: red;
           position: absolute;
       }
   </style>
</head>
<body>

    <button id="button">Get Movies</button>
    <div id="output"></div>
    <script src="app.js"></script>// this is actually the entry point of the app which links to main.ts code and it works just fine. 
</body>
</html>

Answer 1

正确的事件名称addEventListener必须load或onload如下规定： https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest

RXjs button click not gettng server response

Question

1 answers

solution1
1 ACCPTED 2017-04-20 16:41:55

RXjs button click not gettng server response

Question

1 answers

solution1 1 ACCPTED 2017-04-20 16:41:55

solution1
1 ACCPTED 2017-04-20 16:41:55