0

I'm calling a function to get a response from Http.get() request.

My data retrieve function is this one:

getCharacterDetail(characterId: number) {
    return this.http.get(this.characterDetailApiUrl + characterId)
        .subscribe(res =>
            console.log(res.json())
        );
}

Now I have to show this data into a modal window. No idea of what to do.

Makros
  • 352
  • 2
  • 21
  • how does your dom look like? material dialog? bootstrap modal? – Tin May 03 '18 at 19:21
  • Sorry, I'm using bootstrap 3 so, yes, gonna use bootstrap modal – Makros May 03 '18 at 19:24
  • I personally find this solution not so clean, so I switched to use angular material. But if you wanna use bootstrap modal with angular. Here is what you can do. Reference: https://stackoverflow.com/questions/35400811/how-to-use-code-to-open-a-modal-in-angular-2 – Tin May 03 '18 at 19:28
  • Well, I can use Angular Material as well. There is no problem – Makros May 03 '18 at 19:42
  • Think about what you wanna do, then go for it. I'm not saying materia.angular.io is better. I just wanna try it out and learn it. It's pretty new, so they don't have many components like bootstrap. – Tin May 03 '18 at 19:44

2 Answers2

1

Using the code you've provided, here's a rough estimate of what you might be looking for.

app.controller('characterController', function ($scope, $http) {
  $scope.getCharacterDetail = function (number) {
     return $http.get(this.characterDetailApiUrl + characterId)
       .subscribe(res =>
           console.log(res.json())
       );
     }
});
1

ng-bootrstrap would be a good option because modal component is available where you could pass the necessary data as an input to the component.

example

Franklin Pious
  • 3,670
  • 3
  • 26
  • 30
  • Finnaly I'm gonna use ng-bootstrap but fon't know how to implement inside my app.component.ts. :( How to work with more than 1 component in Typescript and make a relation between them – Makros May 04 '18 at 19:12